8000 Question: Did you use this package with React 17 · Issue #123 · reusablejs/reusable · GitHub
[go: up one dir, main page]
More Web Proxy on the site http://driver.im/
Skip to content

Question: Did you use this package with React 17 #123

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clickin 8000 g “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Open
DirkWolthuis opened this issue Apr 29, 2021 · 10 comments
Open

Question: Did you use this package with React 17 #123

DirkWolthuis opened this issue Apr 29, 2021 · 10 comments

Comments

@DirkWolthuis
Copy link

We've updated our app to React 17, but encountered weird bugs where state updates did not get back in other components where the store was used. It's a complex app, but downgrading to React 16 fixed these bugs for us. I will try to make a real bug report, but have any of you encountered this problem?
@adamkleingit
Copy link
Collaborator

Hi, I haven't. @morsdyce ?

@morsdyce
Copy link
Collaborator
morsdyce commented Apr 29, 2021 •
edited
Loading

I haven't used react 17 yet due to some bugs occurring in component libraries but it's usually related to event handling and not state.

Could you reproduce the issue with any of the examples we have?

@DirkWolthuis
Copy link
Author
DirkWolthuis commented Apr 29, 2021 via email

@gev
Copy link
gev commented May 1, 2021 •
edited
Loading

create store:

export const useStore = createStore(() => useState({}));

and use them:

const store = useStore()

returns store === null for the React 17

@gev
Copy link
gev commented May 2, 2021

There is a different babel version in the react 17. Could it be a reason?

@morsdyce
Copy link
Collaborator
morsdyce commented May 2, 2021

Babel shouldn't be the issue as we don't convert syntax using a babel plugin.
I tried reproducing a simple example with React 17 and it worked:

https://codesandbox.io/s/compassionate-fog-ltf4x?file=/src/App.js

It would really help if you could send an example of it not working correctly

@gev
Copy link
gev commented May 2, 2021 •
edited
Loading

one more note, I use react native. It not depends from react-dom

@morsdyce
Copy link
Collaborator
morsdyce commented May 2, 2021

@gev could you reproduce the issue on expo? I don't have an environment ready for react-native

@gev
Copy link
gev commented May 2, 2021 •
edited
Loading

Can't reproduce at expo. All works as well.
On my envirenment bug exists when import custom hook from module.

@bucknermr bucknermr mentioned this issue Feb 15, 2022
Open
@CarpeNecopinum
Copy link

create store:

export const useStore = createStore(() => useState({}));

and use them:

const store = useStore()

returns store === null for the React 17

We had a very similar issue in react-native with React 17 that appears to be caused by the import for the store not actually executing the imported file until a function from it is used. With stores that usually happens within the render method, during which you don't want to be changing around your stores. The solution was to add an "empty" import of the store directly to our App.tsx: import 'stores/thestore'

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
5 participants
@adamkleingit @gev @morsdyce @CarpeNecopinum @DirkWolthuis
0