search

bmcmahen / react-wysiwyg

retain some control over contenteditable input
169 stars 37 forks source link

A quesition on using within Flux #23

Closed ksavenkov closed 9 years ago

ksavenkov commented 9 years ago

Hi,

I want to use react-wysiwyg in Flux architecture. That is, when html is changed, I want to trigger some Action, which will do some API calling if necessary, then dispatch event to the Store to update the model (as ContentEditable takes the html value as a prop from the model).

However, I receive Uncaught Error: Invariant Violation: Dispatch.dispatch(...): Cannot dispatch in the middle of a dispatch. after my Action is trying to dispatch an event to the Store. As I understand, this happens due ComponentEditable is executing 'onChange' in ComponentDidUpdate, which is indeed a wrong place to dispatch some more events.

What approach would you suggest for using react-wysiwyg in Flux? Thanks!

bmcmahen commented 9 years ago

What a nasty error message!

I've used this module within a flux context, but what I typically do is store the html content inside of local component state, and then trigger a flux action only when wanting to save those changes to the local state. I use componentWillReceiveProps to update the local state. It's a bit messy, but I find it typically works -- although this wouldn't satisfy those that want to do away with local component state altogether, and maintain one big app-state.

ksavenkov commented 9 years ago

Thanks, will follow the same path. Updating model on focus out should be enough.