您可以在不调用setState的情况下强制React组件重新呈现吗？

Question

我有一个外部（组件），可观察的对象，我想听这些更改。当对象被更新时，它发出更改事件，然后我想在检测到任何更改时重新呈现该组件。

对于顶层，React.render这是可能的，但是在组件内不起作用（这是有道理的，因为该render方法仅返回一个对象）。

这是一个代码示例：

export default class MyComponent extends React.Component {

  handleButtonClick() {

    this.render();

  }

  render() {

    return (

      <div>

        {Math.random()}

        <button onClick={this.handleButtonClick.bind(this)}>

          Click me

        </button>

      </div>

    )

  }

}

在内部单击该按钮会调用this.render()，但这实际上并不是导致渲染发生的原因（您可以看到它在起作用，因为由创建的文本{Math.random()}不会更改）。但是，如果我只是打电话this.setState()而不是this.render()，它就可以正常工作。

所以我想我的问题是： React组件是否需要具有状态才能重新渲染？有没有一种方法可以在不更改状态的情况下强制组件按需更新？

Answer 1

实际上，这forceUpdate()是唯一正确的解决方案，因为如果在其中或仅返回时实施了附加逻辑，则setState()可能不会触发重新渲染。shouldComponentUpdate()false强制性升级（）调用forceUpdate()将导致render()在组件上被跳过shouldComponentUpdate()。更多...setState（）setState()除非在中实现了条件渲染逻辑，否则它将始终触发重新渲染shouldComponentUpdate()。更多...forceUpdate() 可以从您的组件内部通过调用 this.forceUpdate()