search

facebookarchive / redux-react-hook

React Hook for accessing state and dispatch from a Redux store
MIT License
2.16k stars 103 forks source link

useMappedState returns incorrect value #73

Closed dangcuuson closed 5 years ago

dangcuuson commented 5 years ago

Please see this CodeSandbox for simple redux app that has 2 inputs, that will dispatch a show/hide action on focus/blur event.

If you move the focus from the first input to the second, the the app will dispatch 2 actions & the reducer will update the store correctly (you can check it from redux dev tool)

However, the value returned from useMappedState is incorrect.

The interesting thing is, if I call useSelector hooks from react-redux then the return value of useMappedState is correct again. (You can try it by comment/uncomment line 35 of the code)

Another question is that is this project going to be deprecated in favour of built-in hooks from react-redux? Honestly I don't mind migrating to react-redux, but I couldn't find a way to make it work with multiple redux store

ianobermiller commented 5 years ago

Thanks for the super clear repro, I'll take a look!

The interesting thing is, if I call useSelector hooks from react-redux then the return value of useMappedState is correct again. (You can try it by comment/uncomment line 35 of the code)

That is wild. It must have something to do with the way subscribers are notified.

Another question is that is this project going to be deprecated in favour of built-in hooks from react-redux? Honestly I don't mind migrating to react-redux, but I couldn't find a way to make it work with multiple redux store

Probably worth opening an issue to discuss this in general. This library was a nice stop gap until we got official hooks support. However, redux-react-hook is substantially smaller than react-redux with hooks, so if you only need hooks it is a nicer option. It has also been quite optimized (maybe a bit too much considering this bug).

dangcuuson commented 5 years ago

Thank you for the reply, I guess I'll continue with this library then, it's amazing :smile: .

FYI, if I modify onFocus to dispatch hideVirtualKeyboard before showVirtualKeyboard like this:

onFocus={e => {
    dispatch(hideVirtualKeyboard())
    dispatch(showVirtualKeyboard())
}}

then it also work correctly, regardless of whether useSelector is used or not.

It's also my current workaround for this bug.

ianobermiller commented 5 years ago

Verified this is fixed in master: https://codesandbox.io/s/distracted-kirch-j6xl8 (copied the source in). It was fixed by e8830371ec22fe171a98f1b537a7a3f8e8ef0af3, which hasn't been released (doing it now).