我在react Native中有一个应用程序,该应用程序已定义了几个场景。使用PopToroute方法而不是使用将通过导航堆栈的POP方法的特定场景。
这是我的index.android.js代码,在这里我定义了所有导航路线。
class Flights extends Component {
constructor(props){
super(props);
}
render() {
return (
<Navigator
initialRoute={{id: 'App'}}
renderScene={this.renderScene.bind(this)}
configureScene={(route) => {
if (route.sceneConfig) {
return route.sceneConfig;
}
return Navigator.SceneConfigs.FloatFromRight;
}} />
);
}
renderScene(route, navigator) {
var routeId = route.id;
console.log(routeId);
if (routeId === 'App') {
console.log('App');
return (
<App
navigator={navigator} route={route} />
);
}
if (routeId === 'LoginPage') {
console.log('round');
return (
<AutoCompleteUI
navigator={navigator} route={route} />
);
}
if (routeId === 'LoginPage1') {
console.log('round');
return (
<AutoCompleteUI1
navigator={navigator} route={route} />
);
}
if (routeId === 'MainPage') {
console.log('main');
return (
<MainPage
navigator={navigator} route={route} />
);
}
if (routeId === 'LoginPage') {
console.log('login');
return (
<AutocompleteExample
navigator={navigator} route={route} />
);
}
if (routeId === 'NoNavigatorPage') {
return (
<NoNavigatorPage
navigator={navigator} />
);
}
return this.noRoute(navigator);
}
noRoute(navigator) {
return (
<View style={{flex: 1, alignItems: 'stretch', justifyContent: 'center'}}>
<TouchableOpacity style={{flex: 1, alignItems: 'center', justifyContent: 'center'}}
onPress={() => navigator.pop()}>
<Text style={{color: 'red', fontWeight: 'bold'}}>请在 index.js 的 renderScene 中配置这个页面的路由</Text>
</TouchableOpacity>
</View>
);
}
}
AppRegistry.registerComponent('Flights', () => Flights);
现在问题是如何在任何其他场景中使用Backandroid代码中的PopToroute方法弹出到特定场景??
要使用其他文件中的路由,您将需要创建一个路由。当您需要时文件。
典型的路由。
let Routes = {
OnBoardView: {
name: 'OnBoardView',
component: OnBoardView,
index: 0
},
KeyfactView: {
name: 'KeyfactView',
component: KeyfactView,
index: 4,
sceneConfig: Navigator.SceneConfigs.PushFromRight
}
}
export Routes;
和其他视图文件中,您可以执行此操作:
import Routes from 'routes';
...
this.props.navigator.popToRoute(Routes.KeyfactView);
希望它能帮助您!