this.setState inside navigationOptionsエラーを通知します_this2.setStateは関数ではありません

Question

私はreact-navigationをルーティング目的で使用しています。 1つのコンポーネントで、サイドバー（引出し）を開閉するハンバーガーボタンを表示するようにnavigationOptionsを設定しようとしています。だからonPress私のサイドバーフラグのsetStateしようとしているが、それはエラーを与える_this2.setState is not a function人々はbindを示唆しているが、私はそれが私のシナリオに行くとは思わない。 ここにコードがあります。

static navigationOptions = ({ navigation, screenProps }) => ({ 
     headerLeft: 
      <TouchableOpacity 
       onPress={() => { this.setState({ Sidebar: true }); }} 
      > 
      <Image 
       source={{ uri: 'https://rsna2015.rsna.org/images/hamburger-stale.png' }} 
       style={{ height: 35, width: 35, marginLeft: 10 }} /> 
      </TouchableOpacity> 
}); 

Answer 1

これは予想通りの動作です。

スタティックメソッドの呼び出しは、インスタンス上ではなくクラスに対して行われます。静的メソッドでthisを参照する方法はありません。

これを明確な宣言的な方法で解決するためのポストを書くことは、残念ながらまだ準備ができていません。

当面のための「ダーティ」（不可欠）ソリューションは次のようになり...

static navigationOptions = ({ navigation, screenProps }) => ({ 
    headerLeft: navigation.state.params ? navigation.state.params.headerLeft : null 
}); 

componentDidMount() { 
    // Set route params 
    this.navigation.setParams({ 
    headerLeft: (
     <TouchableOpacity 
     onPress={() => { this.setState({ Sidebar: true }); }} 
     > 
     <Image 
      source={{ uri: 'https://rsna2015.rsna.org/images/hamburger-stale.png' }} 
      style={{ height: 35, width: 35, marginLeft: 10 }} 
     /> 
     </TouchableOpacity> 
    ) 
    }) 
}