1

我正在尝试使用使用react-navigation的pepperoni-app-kit对移动应用程序进行原型设计。但是我发现自己无法向应用程序添加新屏幕;就好像屏幕不存在一样。

这是它的使用方式react-navigation。我已经添加了Pizza屏幕。

import {TabNavigator, StackNavigator} from 'react-navigation'

export const MainScreenNavigator = TabNavigator({
  Pizza: {screen: PizzaLocator},
  Counter: {screen: CounterViewContainer},
  Color: {screen: ColorViewContainer},
}, {
  tabBarOptions: {
    ...Platform.select({
      android: {
        activeTintColor: activeColor,
        indicatorStyle: {backgroundColor: activeColor},
        style: {backgroundColor: headerColor}
      }
    })
  }
})

对于这个新屏​​幕,我模仿了入门包中的其他屏幕:

class PizzaLocator extends Component {
  static displayName = "PizzaLocator"

  static navigationOptions = {
    title: 'Pizza',
    tabBarLabel: "Pizza",
    tabBar: () => ({
      icon: (props) => (
        <Icon name='pizza' size={24} color="Yellow" />
      )
    }),
    // TODO: move this into global config?
    header: {
      tintColor: 'white',
      style: { backgroundColor: '#39babd' }
    }
  }

  render() {
    return (
      <View style={styles.container}>
        <Text>{"It's dangerous to go alone; take this map."}</Text>
      </View>
    )
  }
}

我也尝试过像在其他屏幕中所做的那样包装PizzaLocator一个微不足道PizzaLocatorContainer的(他们所做的最多的是connect(Thing)),但这并没有改变任何事情。

我错过了什么?Pepperoni 使用的方式是react-navigation非标准的吗?谢谢!

4

1 回答 1

0

在终端工具中,cd 到意大利辣香肠的项目,输入命令:yarn add react-navigation,然后执行:react-native run-ios

于 2018-01-08T04:06:26.850 回答