ホームページ > 記事 > ウェブフロントエンド > React が「未定義のプロパティ 'setState' を読み取れません」エラーをスローするのはなぜですか?
React コンポーネントを使用する場合、「プロパティ 'setState' を読み取れません」というエラーが発生する場合があります。未定義です」というエラーが発生しました。この問題は、React コンポーネントのメソッド内で setState メソッドにアクセスしようとしたときに発生しますが、メソッドがコンポーネント インスタンスに適切にバインドされていません。
提供されているたとえば、このエラーは delta() メソッド内で発生します。その理由は、this.delta が Counter コンポーネント インスタンスにバインドされていないためです。これを解決するには、コンストラクターで次のコードを使用します。
<code class="javascript">this.delta = this.delta.bind(this);</code>
デルタ メソッドをコンポーネント インスタンスにバインドすると、デルタ メソッドがコンポーネントの this コンテキストにアクセスできるようになり、setState メソッドにアクセスできるようになります。
コードの修正バージョンは次のようになります:
<code class="javascript">class Counter extends React.Component { constructor(props) { super(props); this.state = { count: 1, }; this.delta = this.delta.bind(this); // Bind 'delta' to the component instance } delta() { this.setState({ count: this.state.count++, }); } render() { return ( <div> <h1>{this.state.count}</h1> <button onClick={this.delta}>+</button> </div> ); } }</code>
デルタ メソッドをバインドすることで、" 「未定義のプロパティ 'setState' を読み取ることができません」というエラーが発生し、コンポーネントが期待どおりにカウントをインクリメントできるようになります。
以上がReact が「未定義のプロパティ 'setState' を読み取れません」エラーをスローするのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。