我正在尝试使用使用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
非标准的吗?谢谢!