Skip to content
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.

By clicking “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

React has detected a change in the order of Hooks #9

Closed
janva255 opened this issue Apr 2, 2021 · 3 comments · Fixed by #17
Closed

React has detected a change in the order of Hooks #9

janva255 opened this issue Apr 2, 2021 · 3 comments · Fixed by #17

Comments

@janva255
Copy link

janva255 commented Apr 2, 2021

It happens to me on a conditionally displayed translation for example, when the condition goes from false to true

condition && <Component label={T("translationKey")} />

Screen Shot 2021-04-02 at 12 47 39

What I did to fix it is to declare it before using it but i prefer doing it like I showed before
const translation = T("translationKey")
condition && <Component label={translation} />

@DoneDeal0
Copy link
Owner

DoneDeal0 commented Apr 12, 2021

Hi, yes your solution is the right way to handle conditional rendering with hooks. Talkr only relies on Context, this is why you must comply to the rule of hooks. It could be fixed, but I'd need to use other packages and this would go against the idea of Talkr: having a super-light i18n solution with 0 dependencies.

@janva255
Copy link
Author

@DoneDeal0 Ok, if this is the only way then I can close this issue, thanks

@DoneDeal0
Copy link
Owner

Issue fixed in #17 .

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants