Best pattern to rerender my react component?

Question

I have a global data object I update and then I call React.renderComponent() again on the top/main component.

Is this the right pattern for triggering this update?

Answer 1

You should generally pass the data object into the component as a prop, even if it's a global variable. This lets you test the component, and also use it elsewhere without being tied to that global.

As Mike said, there's nothing wrong with using React.renderComponent to update it.

He also mentioned flux, but that's overkill for this. A simple event emitter where you do something like .emit('change', newData), and the component is listening for the change event tends to be better for simpler cases. See my answer to this question for an example of how that can be done.

Answer 2

This is the correct pattern. React.renderComponent will either mount a component for the first time, or get an already mounted component to update.

If you're using a global object though, you might want to look in to the Flux architecture here:

http://facebook.github.io/flux/docs/overview.html