0

シナリオ

React Native アプリには、タブ ナビゲーターがあります。各タブには<Checkbox>、状態変数に従ってチェック/チェック解除されるコンポーネントがあり、チェックボックスをクリックしてチェック/チェック解除の値を切り替えることができます。これらのチェックボックス コンポーネントは次のようになります。

<CheckBox
  checked={this.state.a}
  onPress={() => this.setState({a: !this.state.a})}
/>

各タブは独自の状態を持つ独自のコンポーネントであり、それぞれに状態変数が含まれていますa。それぞれ<Checkbox>が「チェック済み」、つまりthis.state.aisで始まりますtrue

異常な行動

タブ A、B、および C があり、this.state.a最初はすべてtrue(したがって、それぞれのチェックボックスがオンになっている) とします。タブAのチェックボックスをクリックするthis.state.aと、Aがなりfalse、期待どおりチェックボックスがオフになります。しかし、タブ B に移動すると、チェックボックスもオフになります。in B は、何らかの理由this.state.aでまだです。trueファイルの 1 つを保存すると、画面がホット リロードthis.state.aされ、B が になりfalseます。

私の質問は次のとおりです。

  1. あるタブでチェックボックスを切り替えると、他のタブで切り替えたチェックボックスの値が影響を受けるのはなぜですか?

  2. this.state.aに切り替わらない場合に、B のチェックボックスがチェックされている状態からチェックされていない状態にするにはどうすればよいfalseですか?

  3. ページをホットリロードするとthis.state.ain B が に切り替わるのはなぜですか?false

4

2 に答える 2