Skip to content
This repository has been archived by the owner on Dec 3, 2022. It is now read-only.

Investigate hook caching #3

Closed
ericvicenti opened this issue Oct 30, 2018 · 6 comments
Closed

Investigate hook caching #3

ericvicenti opened this issue Oct 30, 2018 · 6 comments
Labels
help wanted Extra attention is needed

Comments

@ericvicenti
Copy link
Contributor

Ideally we would be providing the navigation state key to the useEffect hook, but it causes the events to be missed because re-subscription happens frequently.

See for context: https://github.com/react-navigation/react-navigation-hooks/blob/master/src/Hooks.js#L37-L42

Can somebody help investigate if we are doing the right thing here?

@ericvicenti ericvicenti added the help wanted Extra attention is needed label Oct 30, 2018
@cmmartin
Copy link

I get an infinite loop if I pass navigate as a dependency to useEffect since the function changes on every render

function ReactComponent() {
  const {navigate} = useNavigation();

  useEffect(() => {
      if (user) {
          navigate(...)
      }
  }, [user, navigate])

 return null
}

Warning: Maximum update depth exceeded. This can happen when a component calls setState inside useEffect, but useEffect either doesn't have a dependency array, or one of the dependencies changes on every render.

My solution, for now, is to not pass navigate as a dependency, but the hooks eslint rule complains and it seems less than ideal. I'm assuming the caching you describe would solve this?

The link you posted is broken FYI

@slorber
Copy link
Member

slorber commented Aug 23, 2019

The link is old. Yes there's a problem, I'll solve it as soon as I can.

Need to have a proper dev setup first (if you want to help => #28)

@slorber
Copy link
Member

slorber commented Aug 29, 2019

Oh, actually navigate() comes from the ReactNavigation context, so it should rather be cached in core

@slorber slorber mentioned this issue Aug 29, 2019
@slorber
Copy link
Member

slorber commented Aug 29, 2019

@cmmartin the original issue is not totally related to your problem. I've opened a new issue in core for that: https://github.com/react-navigation/core/issues/71

The original issue will be fixed by #3

@slorber
Copy link
Member

slorber commented Aug 31, 2019

should be fixed by release 1.0.3 and #38, please tell me if everything works

@slorber slorber closed this as completed Aug 31, 2019
@slorber
Copy link
Member

slorber commented Aug 31, 2019

@cmmartin ,relative to this issue: https://github.com/react-navigation/core/issues/71

Can you help us understand what you are trying to achieve exactly with the following code?

function ReactComponent() {
  const {navigate} = useNavigation();

  useEffect(() => {
      if (user) {
          navigate(...)
      }
  }, [user, navigate])

 return null
}

Is it something related to switching from authenticated / non authenticated navigators?

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
help wanted Extra attention is needed
Projects
None yet
Development

No branches or pull requests

3 participants