美文网首页
2020-05-28 react hooks useState

2020-05-28 react hooks useState

作者: KingAmo | 来源:发表于2020-05-28 15:34 被阅读0次

    class 组件

    使用class组件时,setState 方法是异步的,你可以在steState的第二个参数中设置回调,使得你可以在 state 更新完后用更新后的 state 做一些操作;

      this.setState({data: 'newData'},() => {
        console.log(this.state.data); // 'newData'
      }}, 
    

    那么用函数式组件 + hooks的时候,怎么实现上述功能呢?

    function组件 + Hooks

      const [data, setData] = useState('Mike')
    

    如果你在setData 后直接使用data数据,使用的还是旧的data数据,要想使用最新的data数据,我们需要配合使用useEffect这个 hook,在 useEffect 的第二个参数中传data就行了,变相的实现了设置回调的效果,完美~

    useEffect(() => {console.log(data)}, [data]) // 'newData'
    

    相关文章

      网友评论

          本文标题:2020-05-28 react hooks useState

          本文链接:https://www.haomeiwen.com/subject/infkactx.html