反応するネイティブのAsyncStorageブロックでsetStateを設定するには？

Question

は私がAsyncStorageブロックにSETSTATEをしたいが、エラーがあります：未定義は（「this.setState」を評価）オブジェクトではありません。

constructor(props){ 
    super(props); 
    this.state={ 
     activeID:this.props.data.channel[0].id 
    }; 
} 

componentDidMount() { 
    AsyncStorage.getItem(this.props.data.type,function(errs,result){ 
     if (!errs) { 
      if (result !== null) { 
       this.setState({activeID:result}); 
      } 
     } 
    }); 
} 

_buttonPressed = (id,name,index) => { 
    this.setState({activeID:id}); 

    AsyncStorage.setItem(this.props.data.type,id,function(errs){ 
    if (errs) { 
     console.log('error'); 
    } 
    if (!errs) { 
     console.log('succeed'); 
    } 
}); 
} 

ご協力いただきありがとうございます。

Answer 1

これはバインディングの問題です。次のことを試してみてください。

componentDidMount() { 
    AsyncStorage.getItem(this.props.data.type, (errs,result) => { 
     if (!errs) { 
      if (result !== null) { 
       this.setState({activeID:result}); 
      } 
     } 
    }) 
} 

この理由はつまり、thisの値は、あなたのコンポーネントのインスタンスではありません、function指定子で宣言された関数は、独自のコンテキストを作成することです。しかし、 "太い矢印"関数は新しいコンテキストを作成しないので、内部のすべてのメソッドを使用することができます。あなたは文脈を維持するためにも同様にbind関数を使うことができますが、この場合、私はこの解決策がずっときれいだと思います。

Answer 2

私は別の解決策を見つけましたが、martinarroyoの答えははるかにクリーンです。

componentDidMount() { 
    this._loadInitialState().done(); 
} 

async _loadInitialState(){ 
    try{ 
     var value=await AsyncStorage.getItem(this.props.data.type); 
     if(value!=null){ 
      this._saveActiveID(value); 
     } 
    } catch(error){ 

    } 
} 
_saveActiveID(id) { 
    this.setState({activeID: id}); 
}