在 React Native 中,我有一个按钮组,我想使用选项卡导航来控制一些选项卡。
标签页都有tabBarVisible: false
,我想通过调用navigate('screen1')
等移动到正确的标签页。但是在我updateTab
从按钮组调用的内部,我onpress
无法访问该navigation.navigate
功能。
我能做些什么?
import { TabNavigator } from 'react-navigation';
const Tabpage = TabNavigator(
{
tab1: {
screen: screen1,
navigationOptions: {
tabBarVisible: false,
tabBarLabel: 'Screen 1'
}, ...
}
export default class Tab extends React.Component {
constructor(props) {
super(props);
this.state = {
tabIndex: 2
};
this.updateTabIndex = this.updateTabIndex.bind(this);
}
updateTabIndex = tabIndex => {
console.log(tabIndex);
this.setState({ tabIndex });
switch (tabIndex) {
case 0:
console.log('nearby chosen');
// navigate('screen1'); // error: no function named navigate
// navigation.navigate('screen1'); // error: not a function
// this.navigate or this.navigation.navigate all fail too
break;
case 1: // etc.
default: // etc.
}
}
render() {
<View style={styles.tabsview}>
<ButtonGroup
containerBorderRadius={40}
selectedBackgroundColor='#FF0000'
onPress={ this.updateTabIndex }
selectedIndex={this.state.tabIndex}
buttons={['screen0', 'screen1', 'screen2']}
containerStyle={{ height: 30 }}
/>
</View>
如何从更改的状态选项卡索引访问导航?