• 技术文章 >web前端 >前端问答

    React是双向数据流吗

    长期闲置长期闲置2022-04-21 11:18:05原创111

    React不是双向数据流,而是单向数据流。单向数据流是指数据在某个节点被改动后,只会影响一个方向上的其他节点;React中的表现就是数据主要通过props从父节点传递到子节点,若父级的某个props改变了,React会重渲染所有子节点。

    本教程操作环境:Windows10系统、react17.0.1版、Dell G3电脑。

    React是双向数据流吗

    React不是双向数据流,react是单向数据流

    vue和ng都是双向数据流、VM双向数据绑定。而react是单向数据流,model层的数据流向view层。

    单向数据流是什么意思?

    单向数据流就是:数据在某个节点被改动后,只会影响一个方向上的其他节点。

    01.png

    单向数据流指只能从一个方向修改数据,姑且我们可以这样理解,如下图所示。一个父组件下有两个子组件1和子组件2,父组件可以向子组件传递数据。假如子组件都获取到了父组件的name,在子组件1中对name重新修改之后,子组件2和父组件中的值并不会发生改变,这正是因为Vue中的机制是单向数据流,子组件不能直接改变父组件的状态。但反过来,如果是父组件中的name修改了,当然两个子组件中的name也就改变了。

    简单的单向数据流(unidirectional data flow)是指用户访问View,View发出用户交互的Action,在Action里对state进行相应更新。state更新后会触发View更新页面的过程。这样数据总是清晰的单向进行流动,便于维护并且可以预测。

    React遵循从上到下的数据流向,即单向数据流。

    React是单向数据流,数据主要从父节点传递到子节点(通过props)。如果顶层(父级)的某个props改变了,React会重渲染所有的子节点。

    单向数据流并非‘单向绑定’,甚至单向数据流与绑定没有‘任何关系’。对于React来说,单向数据流(从上到下)与单一数据源这两个原则,限定了React中要想在一个组件中更新另一个组件的状态(类似于Vue的平行组件传参,或者是子组件向父组件传递参数),需要进行状态提升。即将状态提升到他们最近的祖先组件中。子组件中Change了状态,触发父组件状态的变更,父组件状态的变更,影响到了另一个组件的显示(因为传递给另一个组件的状态变化了,这一点与Vue子组件的$emit()方法很相似)。

    推荐学习:《react视频教程

    以上就是React是双向数据流吗的详细内容,更多请关注php中文网其它相关文章!

    声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。
    专题推荐:React
    上一篇:react路由跳转的几种方式是什么 下一篇:jquery on()有几个参数
    千万级数据并发解决方案

    相关文章推荐

    • react的ssr项目是什么• react中forceupdate的用法是什么• react是不是mvvm框架• react中hooks解决了什么问题• node和react有什么区别
    1/1

    PHP中文网