从shouldComponentUpdate内调用setState可以吗？

  • Z时代
  • 2024-01-10
  • 分类：问答

响应状态更改，我想触发另一个状态更改。这天生是一个坏主意吗？

场景的特定种类是将该组件建模为状态机，该状态机根据的值呈现不同的信息this.state.current_state。但是外部事件可以通过通量存储更改其状态，从而促使其经历状态转换。以下是一个构想可以使您理解的方案：

我认为正确的生命周期方法可以做到这一点shouldComponentUpdate。达到此效果的方法：

shouldComponentUpdate: function(nextProps, nextState) {
    if (nextState.counter > 4 && this.state.current_state !== DISPLAY_MANY) {
        this.setState({ current_state: DISPLAY_MANY });
    }
    return true;
}

在某些子组件中，counter可能会增加，因此counter，我不想显式地对状态进行编码，而不是根据某个变量的值推断其显示的内容。

实际场景比这要复杂得多，但希望此场景足够详细，可以使您理解。做我想的可以吗？

编辑：固定代码示例，通过添加额外的状态条件来避免触发无限循环

回答：

shouldComponentUpdate专门用于确定组件是否应该完全更新。做类似的事情：

if (nextState.counter == this.state.counter && nextProps.foo == this.Props.foo) {
  return false;
}

componentWillReceiveProps用于响应 外部

（道具）更改。componentWillReceiveState正如文档中指出的那样，没有等效项。您的组件（并且只有您的组件）通常通过以下一个或多个事件来触发自己的状态更改：

  • 初始渲染 getInitialState

  • 更新了道具 componentWillReceiveProps

  • <input>字段等中的用户交互，例如onChangeInput()组件中的自定义功能。

  • 不断变化：响应来自侦听器的存储更改，通常在调用的自定义函数中进行getStateFromStores()，状态会更新。

我想

在您的情况下，您可以将逻辑（以确定状态是否需要更新）移至getStateFromStores()处理商店更新的功能。

或者，您可以简单地保持其状态，并更改渲染功能，以便在counter> 4时以不同的方式渲染。

以上是 从shouldComponentUpdate内调用setState可以吗？ 的全部内容， 来源链接： utcz.com/qa/429466.html

回到顶部