Javascript 如何使用React Native中的Navigator对要转换到的组件调用方法？

我的主要导航组件如下所示：

class Main extends React.Component {
   constructor() {
      super();
      this.state = {
         views: [
            { title: 'Page 1', component: React.createElement(PageOne) },
            { title: 'Page 2', component: React.createElement(PageTwo) },
            { title: 'Page 3', component: React.createElement(PageThree) }
         ],
         currentView: 'Page 1'
      };
   }
   changeScene(data) {
      if (this.refs.navigator.getCurrentRoutes().find(r => r.title === data.title))
         this.refs.navigator.jumpTo(data);
      else
         this.refs.navigator.push(data);
      this.setState({currentView: data.title});
   }
   renderScene(route, navigator) {
      return route.component;
   }
   render() {
      return (
         <View>
            <Navigator
               ref="navigator"
               style={{flex: 1}}
               initialRoute={this.state.views[0]}
               renderScene={this.renderScene} />
         </View>
      );
   }
};

---

但这显然不起作用。实现这一点的最佳方法是什么？

也许可以尝试在componentWillMount或其他适当的生命周期方法上执行已传递的回调，以便组件是检查是否已转换到的组件，而不是父组件试图直接在子组件上执行某些操作

大体上：

React.createElement(PageOne, { isActive: () => this._isActive(PageOne) })
...
_isActive(component) {
    let routes = this.refs.navigator.getCurrentRoutes();
    return component === routes[routes.length - 1];
}

在组件中：

componentWillMount() {
    if (this.props.isActive()) { 
        // Set state to affect render 
    }
}

---

当场景已经渲染时，

componentWillMount

将不会被调用，因为我没有尝试对

componentWillMount

进行特定/独占。你甚至可以从渲染中调用它，或者传递一个道具并更新它。。。。要点：反转行为所在的位置并将其放入子组件中，而不是尝试从父组件执行其内部的某些操作。

componentWillMount() {
    if (this.props.isActive()) { 
        // Set state to affect render 
    }
}