2017-09-24 12 views
0

React Navigationを使用しています。戻るボタンを押したときにカスタム機能が必要です。ここに私のコードは次のとおりです。ReactネイティブBackHandlerがイベントを削除しないListener

class AddEditIngredient extends Component { 
    constructor(props) { 
    super(props); 
    this.state = { 
     editStarted: false 
    }; 
    this.goBack =() => { 
     if (this.state.editStarted === true) { 
     Alert.alert(
      "Ingredient Not Saved", 
      "Do you want to navigate away without saving ingredient?", 
      [ 
      { text: "Cancel", onPress:() => null, style: "cancel" }, 
      { text: "Yes", onPress:() => this.props.navigation.goBack() } 
      ], 
      { cancelable: true } 
     ); 
     } else { 
     this.props.navigation.goBack(); 
     } 
    }; 
} 

componentWillMount() { 
    BackHandler.addEventListener("hardwareBackPress", this.goBack); 
} 

componentWillUnmount() { 
    BackHandler.removeEventListener("hardwareBackPress", this.goBack); 
} 

マイGOBACK機能は、私は物理的なバックボタンを押ししようとすると、しかし、それはすべての画面を飛び出し、アプリケーションを最小化し、画面上の戻るボタンのために正常に動作します。問題の以前の投稿を読んで私が収集したものから、removeEventListenerはaddEventListenerと同じ関数を参照していません。だから私はこれを試した:

constructor(props) { 
    super(props); 
    this.state = { 
     editStarted: false 
    }; 
    this.goBack = this.goBack.bind(this); 
} 
goBack =() => { 
     if (this.state.editStarted === true) { 
     Alert.alert(
      "Ingredient Not Saved", 
      "Do you want to navigate away without saving ingredient?", 
      [ 
      { text: "Cancel", onPress:() => null, style: "cancel" }, 
      { text: "Yes", onPress:() => this.props.navigation.goBack() } 
      ], 
      { cancelable: true } 
     ); 
     } else { 
     this.props.navigation.goBack(); 
     } 
    }; 

しかし、それは動作しませんでした。誰も私の間違いを指摘できますか?

おかげ

答えて

0

は最後にthis postで答えを見つけました。私は、バック動作が処理されたことを示すために、goBack関数の最後にtrueを返す必要がありました。

関連する問題