在 React 中使用 forceUpdate 而不是 setState？答案

【问题标题】：Using forceUpdate instead of setState in React?在 React 中使用 forceUpdate 而不是 setState？
【发布时间】：2023-03-15 09:35:02
【问题描述】：

如果我有一个 react 组件，我只是设置它的类变量，即

class MyComponent extends React.Component {

    constructor(props) {
      super(props);
      this.numberElements = 20;
      this.color = 'red';
    }

    render() { 
       ...
    }
}

我不能只调用this.forceUpdate() 来发出重新渲染（每当我更新我的类变量时）而不是维护一个状态并调用setState 吗？或者这样做不好，如果是，为什么？

【问题讨论】：

是的，这是不好的做法，生命周期事件和 setState / props 存在是有原因的。如果您需要使用 forceUpdate 则表明您做错了什么，恕我直言
这可能会更清楚stackoverflow.com/questions/47237556/…

标签： javascript reactjs

【解决方案1】：

forceUpdate() 在您所描述的场景中实际上很有用。

来自docs：

默认情况下，当您的组件的状态或道具发生变化时，您的组件将重新渲染。如果你的 render() 方法依赖于其他一些数据，你可以通过调用 forceUpdate() 告诉 React 组件需要重新渲染。

但需要注意的是，它将跳过 shouldComponentUpdate()，因此您不会获得优化收益。

此外，使用forceUpdate()“绕过”正确的生命周期，使您的代码不那么直接，并且可能更难以理解和维护。

因此建议尽可能使用state 和props。

通常你应该尽量避免使用 forceUpdate() 并且只在 render() 中读取 this.props 和 this.state。

【讨论】：

"forceUpdate() 在您所描述的场景中实际上很有用。"什么场景？ Op 只是说“......我只是设置它的类变量......”。我看不出有任何理由不通过适当的程序。除非 OP 能找到比“我只是喜欢它”更令人信服的理由，否则我倾向于同意 Icepickle 和 Shubham Khatri。
尚未完全售出。 forceUpdate() 和类变量对我来说似乎仍然更容易，我不需要 shouldComponentUpdate。