美文网首页
React 状态提升

React 状态提升

作者: BlinglingSam | 来源:发表于2021-08-21 17:00 被阅读0次

    在不使用任何状态管理方案的前提下,React 组件之间共享状态,只能靠 props 传播。

    • 父->子的传播非常容易,直接 A->B
    • 子->父 :调用父组件传递过来的方法去实现。传递的数据放在参数里面。
      (父组件将一个改变自身状态的方法传递给子组件,子组件去调用的同时将一些参数传给它)
    • 隔代传, A->B->C....Z
    • 兄弟之间,React传递数据的范式是自上而下传递,这显然违背了这一范式,所以为了处理兄弟组件简单通信,就有了状态提升这一概念。简单来说,React中的兄弟组件简单通信,就是所谓的状态提升。

    状态提升的场景

    兄弟组件中,它们各自的内容保存在各自的 state 当中,要怎么做才能使两个组件共享数据呢?
    答案是 状态提升,也就是给他们创建一个共同的父亲,将数据保存在它们的父组件中,使这两个兄弟组件之间可以从父组件中到拿到共享的状态,状态彼此能够同步。

    案例可以参考官方文档。

    相关文章

      网友评论

          本文标题:React 状态提升

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