首页 文章

React Native Navigator,在RenderScene中调用函数时遇到问题

提问于
浏览
0

我正在使用React Native Navigator组件,并且我使用其renderScene方法设置了路由:

<Navigator
     ref="navigator"
     initialRoute={{name:'Main'}}
     renderScene={(route,navigator)=>this.renderScene(route,navigator)} />

然后,在我的renderScene中,我想调用一个外部方法toggleSideMenu,如下所示:

toggleSideMenu() {
    this.setState({
       menuDisableGestures: false
    });
}

renderScene(route, navigator) {
    switch (route.name) {
      case "SecondView":
        this.toggleSideMenu.bind()
        return <SecondView navigator={navigator} />
 ....

但是,永远不会调用toggleSideMenu . 如果我将我的呼叫从 this.toggleSideMenu.bind() 更改为 this.toggleSideMenu() ,则会收到错误消息:

在现有状态转换期间无法更新(例如在 render 内) . 渲染方法应该是道具和状态的纯函数 .

关于如何从renderScene中调用外部函数的任何想法?

1 回答

  • 1

    您可以从renderScene函数调用函数而不会出现任何问题 . 使用 this.toggleSideMenu(); 但是你在这里做的是,你正在更新toggleSidemenu函数中的状态 .

    this中所述,

    问题是setState将导致重新渲染(可能取决于shouldComponentUpdate) . 如果在render函数中有一个setState调用,它将触发另一个渲染 . 你可能最终会进行无限循环的重新渲染 . 由于某些异步操作(实际上它很常见),没有什么能阻止你使用setState . 只要它不在渲染或在状态更新上运行的组件的其他生命周期方法中就可以了(ifComponentUpdate是另一个,因为你以相同的方式结束了无限循环) .

    因此,如果从toggleSidemenu中删除setState,那么函数将毫无问题地执行 .

相关问题