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

Recursive react render bug #420

Open
HexaField opened this issue Dec 20, 2024 · 2 comments
Open

Recursive react render bug #420

HexaField opened this issue Dec 20, 2024 · 2 comments

Comments

@HexaField
Copy link

The following code will cause a recursive render loop. Changing state2 from {} to a primitive value (such as true) OR removing the .value stops the behavior. Is this intentional? Why is using .value in dependencies like this causing a recursive re-render? In virtually all other cases, using .value in a dependency does not cause re-renders of any kind.

const Child = (props: { state: any }) => {
  const state2 = useHookstate({})
  
  useEffect(() => {
    props.state.set({})
  }, [state2.value]) // getting rid of .value here solves the problem
  
  return <></>
}

const Parent = () => {
  const state = useHookstate({})

  useEffect(() => {
    console.log('state', state.value)
  }, [state])

  return <Child state={state} />
}
@speigg
Copy link
Contributor

speigg commented Dec 20, 2024

Issue is reproduced in a test case here: speigg@cbe5e3a

@speigg
Copy link
Contributor

speigg commented Dec 20, 2024

Also, to clarify, the issue is that the useEffect runs more than it should.

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

No branches or pull requests

2 participants