[解決済み] setStateを呼び出さずにReactコンポーネントを強制的に再レンダリングすることは可能ですか？

質問

私は、外部（コンポーネントに対して）、変更をリッスンしたい観測可能なオブジェクトを持っています。このオブジェクトが更新されると、変更イベントを発行し、変更が検出されるとコンポーネントを再レンダリングしたいのです。

トップレベルの 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コンポーネント が必要です。 は、再レンダリングするために状態を持っていますか？状態を変更せずに、コンポーネントをオンデマンドで強制的に更新させる方法はありますか？

解決方法を教えてください。

クラスコンポーネントでは this.forceUpdate() で強制的に再レンダリングします。

ドキュメンテーション https://facebook.github.io/react/docs/component-api.html

ファンクションコンポーネントには forceUpdate しかし で強制的に更新する方法を考えましょう。 useState フック .