这个.setState({})会保证引起重新渲染吗？

Question

我需要维护一些代码，其中有这样一行：

this.setState({}); // Force update

这会保证导致重新渲染吗？

- BruceM

---

使用this.forceUpdate()可以保证强制重新渲染，但会对代码结构和实践方式产生疑问。 - Anurag Srivastava

谢谢 - 但是这个 this.setState({}) 会强制更新吗？ - BruceM

Answer 1

setState 方法以不可变的方式将作为参数传递的对象合并到实际状态中。this.setState({}) 不会将任何内容合并到状态中，而实际上会返回一个新的对象，由 React 执行的浅比较将始终断言为 false 并触发重新渲染，除非使用 shouldComponentUpdate 显式取消。所以，在这种情况下，它等同于 forceUpdate 并具有相同的注意事项。

- Dupocas

Answer 2

你可以很容易地进行测试，请点击此处:

import React, { Component } from 'react';
import { Button } from 'react-native';

class Test extends Component {
  render() {
    console.log('render');
    return <Button onPress={() => this.setState({})} title='Test' />;
  }
}

export default Test;

每次点击按钮时，console.log会触发。

有趣的一点是，如果您将this.setState({})替换为this.setState()，则单击后不会重新渲染。

- remeus

Answer 3

根据文档，它是和其他几种方法一起使用的。

1. static getDerivedStateFromProps()
2. shouldComponentUpdate()
3. render()
4. getSnapshotBeforeUpdate()
5. componentDidUpdate()

请查看此链接以获取详细信息。

- techipank

Answer 4

这要看情况。如果你想渲染一个组件，React 会内部检查 DOM 是否与之前相同（如果组件的 props 没有改变）。如果 DOM 与之前版本相同，React 将检查 shouldComponentUpdate。 forceUpdate 与 this.setState({}) 不同，它总是会重新渲染组件。

- Abdullah Tellioglu

---

这与它们引用的答案和文档中所述的相矛盾。 - BruceM