Question

我有一个TabBarMenu（这是一个基本的View组件），当堆栈中有超过2条路由时，我想去看看。

我试图这样做，但它崩溃说我尝试在渲染方法中更新

2016-05-10 12：38：27.901 [warn] [tid：com.facebook.react.JavaScript] 警告：setState（...）：在现有状态期间无法更新过渡（例如在render内）。渲染方法应该是纯粹的道具和国家的功能。

这是我尝试过的代码：

hideMenu = () => {
  this.setState({displayMenu: false});
};

showMenu = () => {
  this.setState({displayMenu: true});
};

renderScene = (tab, navigator) => {
  if (navigator.getCurrentRoutes().length > 1) {
    this.hideMenu();
  } else {
    if (!this.state.displayMenu) {
      this.showMenu();
    }
  }
  return React.createElement(tab.component, _.extend({navigator: navigator}, tab.passProps));
};

render() {
  return (
    <View style={styles.tabbarContainer}>
      <Navigator
        ref='tabs'
        key='navigator'
        style={{backgroundColor: '#FFFFFF', flex: 1}}
        initialRoute={_.extend(this.props.tabs[this.props.initialSelected || 0])}
        renderScene={this.renderScene}
        configureScene={() => {
          return {
            ...Navigator.SceneConfigs.FadeAndroid,
            defaultTransitionVelocity: 1000,
            gestures: {}
          };
        }} />
      {this.state.displayMenu ? [
        <Menu
          key='menu'
          style={styles.menu}
          active={this.state.active}
          tabs={this.props.tabs}
          tabsBlocked={this.props.tabsBlocked} 
          resetToTab={(index) => this.resetToTab(index)} />
      ] : null}
    </View>
  );
};

问题来自renderScene功能，但我无法找到另一种方法来实现这一目标。有什么猜测我怎么做的？

React-Native：如何根据路由数使用Navigator更改根组件的状态

0 个答案: