Synthetic Events get lost through an Action
See original GitHub issueI have a Store Action that gets triggered on an input field onChange
(it’s a type="file"
input), I need the event in order to get the target’s values, but triggering a Store Action on onChange gets the event killed on the way.
warning.js:36 Warning: This synthetic event is reused for performance reasons. If you're seeing this, you're accessing the property `target` on a released/nullified synthetic event. This is set to null. If you must keep the original synthetic event around, use event.persist().
Shouldn’t actions be synchronous operation? Unless specified otherwise?
Issue Analytics
- State:
- Created 7 years ago
- Comments:12 (12 by maintainers)
Top Results From Across the Web
SyntheticEvent - React
The synthetic events are different from, and do not map directly to, ... because this input lost focus'); }} placeholder="onBlur is triggered when...
Read more >Handling React Events - A Detailed Guide - KnowledgeHut
Synthetic event is reused for performance reasons in the browser, A synthetic event is a cross-browser wrapper around the browser's native event ......
Read more >Event Bubbling and Event Catching in JavaScript and React
React, on the other hand, has created something called the SyntheticEvent. These are simply wrappers for the browser's event object. The basic ...
Read more >Event Handler on React Component not invoked ... - GitHub
A React Component with an Event Handler (for example onClick) is rendered inside ... using those native events, instead of synthetic events.
Read more >How To Handle DOM and Window Events with React
In web development, events represent actions that happen in the web browser. ... The API for SyntheticEvent is similar to the native Event...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
My general thoughts on bumping major version is that you should have a pretty good reason to do so, because anytime you do something backward-breaking like that you tick off a number of people that don’t like change. So the benefit of the backward-breaking change has to outweigh its own cost.
Been debating on whether this sync change balances that equation or not.
…though eek’s point about redux users is a good one…I think that tips scales enough to be worth the major change.
I’ll start looking at what might need to be done to make actions sync by default (except for actions with child-actions).
Well, the store is automatically created during
componentWillMount
.So there’s two main options. Move your action call after that, or create your store before that.
So you could do your action call in the
componentWillMount
, after you super call. Or do it async to push the action to the event loop like you were doing (though, like I said…be careful with that…I don’t think there’s any reason React couldn’t one day just make there be time between constructor and mount, in which case that would make a race issue).Or, (I think) the more elegant way to do things, if you know you’re gonna use actions before components mount, then you can just not wait for the store to be made automatically, and call
Reflux.initStore(MyStoreClass);
. You can probably just put it at the end of the store class itself.