reactjs – 在React中,setState和forceUpdate之间有什么区别

发布时间：2020-12-15 20:50:36 所属栏目：百科来源：网络整理

导读：在不覆盖shouldComponentUpdate的组件中,forceUpdate和setState之间有什么区别吗？更新：我已经知道文档说的内容,并且forceUpdate不是推荐的方法.我只是想更深入地了解正在发生的事情.我想知道为什么？我已经知道setState将传递的对象(状态“delta” – 类

在不覆盖shouldComponentUpdate的组件中,forceUpdate和setState之间有什么区别吗？

更新：我已经知道文档说的内容,并且forceUpdate不是推荐的方法.我只是想更深入地了解正在发生的事情.我想知道为什么？我已经知道setState将传递的对象(状态“delta” – 类似于sql update)与当前状态对象合并.

假设一个简单的用例：不需要撤消或时间旅行功能.无需在shouldComponentUpdate中进行指针比较.实际上,根本不需要使用shouldComponentUpdate.

在这种情况下,在我看来,变异状态和调用forceUpdate()是使用React的完全有效的方法.从黑匣子的角度来看,这两种技术似乎具有完全相同的效果：

技术#1：
this.state.x = 10;
this.forceUpdate();

技术#2：
this.state.setState({X：10});

再一次,我已经知道有些人宁愿永远不要改变国家.并使用函数式编程风格.我只是想知道是否有任何技术原因可以避免技术#1.或者我错过了什么？

关于setState()的一般信息

setState()函数通常用于使用一个或多个新的状态属性更新组件状态.这是改变状态和管理视图更新的典型方法.

来自官方文档：

setState() enqueues changes to the component state and tells React
that this component and its children need to be re-rendered with the
updated state. This is the primary method you use to update the user
interface in response to event handlers and server responses.

一般关于forceUpdate()

forceUpdate()函数只是强制重新呈现组件及其子代的一种方法.它根本不会改变状态.

在可能的情况下,您应该避免使用此功能,因为它偏离了React思维模式,您的状态和道具全权负责使您的应用程序逻辑与您的视图保持同步.

来自官方文档：

By default,when your component’s state or props change,your
component will re-render. If your render() method depends on some
other data,you can tell React that the component needs re-rendering
by calling forceUpdate().

Normally you should try to avoid all uses of forceUpdate() and only read from this.props and this.state in render().

差异

重要的是要注意forceUpdate()将跳过检查shouldComponentUpdate()中的逻辑(如果有的话),其中setState()不跳过它.

这里有一个有趣的注意事项是,以下两行将始终产生相同的结果：

this.setState(this.state);
this.forceUpdate();

…除非shouldComponentUpdate()可以返回false,如上所述.

除此之外,两者之间没有功能差异.

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!