我已经使用 React native 实现了一个选项卡 View ,但我需要从子屏幕导航到另一个父屏幕。
查看此图片:My UI
在上图中,当我单击下一步按钮时,我可以在选项卡之间导航,但我需要导航到另一个主视图。我该怎么做?
找到下面的代码:
MainScreen.js
class MainTabView extends Component {
state ={
index: 0,
routes: [
{ key: 'offers', title: 'Offers'},
{ key: 'ternding', title: 'Trending'},
{ key: 'retails', title: 'Retails'}
]
}
_updateRoute(newIdx) {
this.setState({index: newIdx})
}
render() {
return(
<View style={styles.scene}>
<Button title={'Main'} onPress={() => { this.props.navigation.navigate('Splash')}}></Button>
<TabView
navigationState={this.state}
renderScene={SceneMap({
offers: Offers,
ternding: Retails,
retails: Trending,
})}
onIndexChange={index => this.setState({ index })}
initialLayout={{ width: Dimensions.get('window').width }}
indicatorStyle={{ backgroundColor: 'pink' }}
useNativeDriver
/>
</View>
)
}
}
Offers.js
class Offers extends Component {
state = {
title: 'Next Screen'
}
componentDidMount() {
}
render() {
return (
<View style={styles.background}>
<Button title={'Next'} onPress={() => {
this.props.navigation.navigate('Splash')
}}></Button>
</View>
);
}
}
最佳答案
我遇到了同样的问题,我能够使用以下方法在子选项卡中获取导航对象
import { withNavigation } from 'react-navigation';
https://reactnavigation.org/docs/en/with-navigation.html 引用自本期https://github.com/react-native-community/react-native-tab-view/issues/907
关于react-native - 我尝试了 React Native Tab View。路由导航在 renderScene 组件中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58627867/