connect-backbone-to-react icon indicating copy to clipboard operation
connect-backbone-to-react copied to clipboard

Problem with using Context in React Classes

Open ruaneg opened this issue 4 years ago • 2 comments

Hi guys,

Thanks for sharing your plugin!

Ive recently upgraded React along with your plugin so I can take advantage of using React Context API. For functional components everything has worked fine. However if I use Context in a class component, which is also connected to your plugin via connectBackboneEvents HOC I get console errors when the model listeners are setup.

Uncaught TypeError: model.on is not a function createEventListener createEventListener createEventListeners createEventListeners ConnectBackboneToReact constructClassInstance

Debugging the code it seems that the context 'this.context' in my wrapped component is being used as the context in the HOC. const models = Object.assign({}, this.context, this.props.models); https://github.com/mongodb-js/connect-backbone-to-react/blob/master/lib/connect-backbone-to-react.js#L88 Screenshot 2020-10-29 at 17 03 21

Screenshot 2020-10-29 at 17 16 01

I know I can work my way around this by not using context in components that are using this HOC. However, that is a bit of a workaround, and it would be nice if we could fix the plugin to handle all scenarios. Perhaps reworking the validateModelTypes function to ensure only Backbone models are set to this.models.

Thanks! Gary

ruaneg avatar Oct 29 '20 17:10 ruaneg

Heya! Thanks for opening the issue! Do you mind providing some code that reproduces the issue so I can better understand how to fix it? Thanks!

hswolff avatar Jan 06 '21 14:01 hswolff

Hi,

Ill try and put something together this week on jsfiddle/codepen.

cheers

ruaneg avatar Jan 12 '21 09:01 ruaneg