我正在尝试使用 react-native-navigation 组合我的第一个应用程序，并且我正在从网站上的可用示例中获取片段。
无论如何，我现在正在尝试使用推送功能来显示新屏幕，但导航器似乎未定义：
结构是：
- app.js
- firstScreenTab
- pushScreenTab
- secondScreenTab
导航器显然是在 app.js 文件中定义的。
在我的第一个屏幕选项卡中：
testNavPress() {
this.props.navigator.push({
screen: 'manager.SecondTabScreen',
title: 'Pushed Screen'
});
}
<Button onPress={this.testNavPress.bind(this)}>
Push
</Button>
`
我使用 redux 设置我的应用程序，我想知道如何将我的导航器作为道具传递？
我的app.js中的启动应用程序函数如下所示：
startApp(root) {
console.log(root);
console.log('START APP!!!!!');
const tabs = [
{
label: 'Employees', // tab label as appears under the icon in iOS (optional)
screen: 'manager.EmployeeListScreen', // unique ID registered with Navigation.registerScreen
icon: require('../img/one.png'), // local image asset for the tab icon unselected state (optional on iOS)
selectedIcon: require('../img/one_selected.png'), // local image asset for the tab icon selected state (optional, iOS only. On Android, Use `tabBarSelectedButtonColor` instead)
iconInsets: { // add this to change icon position (optional, iOS only).
top: 6, // optional, default is 0.
left: 0, // optional, default is 0.
bottom: -6, // optional, default is 0.
right: 0 // optional, default is 0.
},
title: 'Employee List', // title of the screen as appears in the nav bar (optional)
navigatorStyle: {}, // override the navigator style for the tab screen, see "Styling the navigator" below (optional),
navigatorButtons: {
rightButtons: [
{
icon: require('../img/navicon_add.png'), // for icon button, provide the local image asset name
id: 'add' // id for this button, given in onNavigatorEvent(event) to help understand which button was clicked
}
]
} // override the nav buttons for the tab screen, see "Adding buttons to the navigator" below (optional)
},
{
label: 'One', // tab label as appears under the icon in iOS (optional)
screen: 'manager.FirstTabScreen', // unique ID registered with Navigation.registerScreen
icon: require('../img/one.png'), // local image asset for the tab icon unselected state (optional on iOS)
selectedIcon: require('../img/one_selected.png'), // local image asset for the tab icon selected state (optional, iOS only. On Android, Use `tabBarSelectedButtonColor` instead)
iconInsets: { // add this to change icon position (optional, iOS only).
top: 6, // optional, default is 0.
left: 0, // optional, default is 0.
bottom: -6, // optional, default is 0.
right: 0 // optional, default is 0.
},
title: 'Screen One', // title of the screen as appears in the nav bar (optional)
navigatorStyle: {}, // override the navigator style for the tab screen, see "Styling the navigator" below (optional),
navigatorButtons: {} // override the nav buttons for the tab screen, see "Adding buttons to the navigator" below (optional)
},
{
label: 'Two',
screen: 'manager.SecondTabScreen',
icon: require('../img/two.png'),
selectedIcon: require('../img/two_selected.png'),
title: 'Screen Two'
}
];
switch (root) {
case 'user':
Navigation.startTabBasedApp({
tabs,
tabsStyle: {
tabBarButtonColor: 'white',
tabBarSelectedButtonColor: 'white',
tabBarBackgroundColor: '#099880'
}
});
break;
default:
Navigation.startSingleScreenApp({
screen: {
screen: 'manager.LoginScreen', // unique ID registered with Navigation.registerScreen
title: 'Log in', // title of the screen as appears in the nav bar (optional)
navigatorStyle: {}, // override the navigator style for the screen, see "Styling the navigator" below (optional)
navigatorButtons: {} // override the nav buttons for the screen, see "Adding buttons to the navigator" below (optional)
}
});
}
} // startApp
}
export default App;
我浏览了其他问题，但其中大多数是指 react-navigation，我正在使用 react-native-navigation。