React Native 组件中的 onEnter/onExit 方法（react-native-router-flux）

Question

所以我可以在路由器定义中的应用程序根目录中使用 onEnter/onExit 方法，它工作得非常好：

<Scene key="arena" hideNavBar={true}  onEnter={() => console.log("Entered")} component={ArenaPage} />

有什么办法可以在组件本身内部执行此操作，以便我可以更新本地状态？？

export default class ArenaPage extends Component {
    onEnter () {
        this.setState(...)
    }
    // Render blah blah blah...
}

如果不可能，在离开场景时是否仍然触发componentWillUnmount（Actions.[key]）

Answer 1

您可以使用onEnter 和onExit 方法来获得您想要的结果。反过来可以像这样访问this。

import { Actions } from 'react-native-router-flux'

class Home extends Component {
  static onEnter() {
     // homeSceneKey needs to be the same key that you use to configure the Scene
     Actions.refs.homeSceneKey.getWrappedInstance().myFunction()
  };

  myFunction = () => {
     // have access to this (props and state) here
     this.blah = "what ever you want to do"
  }
}

希望对你有帮助

Answer 2

请查看最新的react-native-router-flux:beta.27，现在您可以定义 onEnter、onExit 方法作为您的 react 组件方法。

class Home extends Component {
  static onEnter() {
    console.log('On Focus Enter')
  };
  static onExit() {
    console.log('On Focus Exit')
  }
}

Answer 3

简单使用componentWillUnmount，在arenaPage组件中。

componentWillUnmount() {
    // add your code here.
}

因为它会在导航离开组件时运行。 我正在使用它来删除错误消息。这行得通。