React Native Component中的onEnter / onExit方法(react-native-router-flux)

时间:2017-11-30 12:40:55

标签: javascript reactjs react-native react-native-router-flux

所以我可以在我的应用程序的根目录中使用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

3 个答案:

答案 0 :(得分:3)

请检查最新的react-native-router-flux:beta.27,现在您可以将onExit,onExit方法定义为反应组件方法。

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

答案 1 :(得分:0)

在arenaPage组件中使用componentWillUnmount。

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

因为远离组件导航时会运行。 我正在使用它来删除错误消息。这很有效。

答案 2 :(得分:0)

您可以使用onEnteronExit方法来获得所需的结果。然后依次可以访问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"
  }
}

希望这会有所帮助