Question

我有一个复杂的应用程序，有很多行，所以我想最大限度地分割文件，以避免文件中有大量的行。

这是我的代码：

export default class Nav extends Component {
 return(
   <Navigator
     initialRoute={ ... }
     renderScene={ ... }
     navigationBar={ <Navigator.NavigationBar routeMapper={ ... }/> }
   />
 )
}

这是我想要实现的目标：

export default class Nav extends Component {
 return(
   <Navigator
     initialRoute={ ... }
     renderScene={ ... }
     navigationBar={ <MyNavigationBar/> }
   />
 )
}

export default class MyNavigationBar extends Component {
 return(
   <Navigator.NavigationBar routeMapper={ ... }/>
 )
}

但是当我这样做时，我有一个例外： undefined不是对象（评估'navState.routeStack'）

为什么？我该怎么办？

Answer 1

我认为您的NavigationBar组件现在缺少某些属性。

您应该尝试将所有属性传递给NavigationBar组件。

如documentation

中所述

此组件将收到两个道具：navigator和navState，表示导航器组件及其状态。当路线改变时，该组件将被重新渲染。

试试这个：

export default class MyNavigationBar extends Component {
  return(
    <Navigator.NavigationBar {...this.props} routeMapper={ ... }/>
  )
}

React Native deport Navigator.NavigationBar到另一个文件（干净代码）

1 个答案: