javascript - 从子组件响应更改 UseState

Question

是否可以从子组件内部更改 useState 的值？

家长:

const [state, setState] = useState(false);

return <Child func={() => setState(true)}/>

child :

return <Button onClick={props.func}> Click me to set the state </Button>

这样不行，有什么办法可以吗？谢谢

Answer 1

你可以这样做

//PARENT
export default function Parent({}) {
  const [state, setState] = useState(false);
        function setParentValue(value){
             setState(value)
       }

        return <Child setValue={setParentValue} />

}

//CHILD
export default function Child({setValue}) {
  function buttonHandler(){
      setValue('value')
 }
  return <Button onClick={buttonHandler}> Click me to set the state </Button>

}