我在 RN 中导航有问题,所以我想你可以帮助我。我找不到从“设置”选项卡导航到“已注销”的任何方法,this is my repo ,代码并不复杂,你只需要在“navigation”和“screens”文件夹中查找即可。事情是我的“设置”文件在一个文件“MainTabNavigator”中,而 SignedOut 在“RootNavigation”中,当我尝试这样的事情时:
this.props.navigation.navigate("SignedOut");
什么也没发生,这是我的功能:
onSignOut()
.then(() => {
console.log('Logout!');
this.props.navigation.navigate("SignedOut");
})
.catch(e => {
console.log(e);
})
我确实打印了此日志,因此它应该成功调用此导航方法。你有什么想法吗?我的意思是,我认为这就是我在这里遗漏了什么的原因?
这是我的 MainTabNavigator 的样子:
import React from 'react';
import { Platform } from 'react-native';
import { Ionicons } from '@expo/vector-icons';
import { TabNavigator, TabBarBottom, DrawerNavigator } from 'react-navigation';
import Colors from '../constants/Colors';
import HomeScreen from '../screens/HomeScreen';
import ListScreen from '../screens/ListScreen';
import SettingsScreen from '../screens/SettingsScreen';
import WordDetails from '../screens/WordDetails';
import DrawerMenu from './drawerDesign/Drawer';
export default DrawerNavigator(
{
Home: {
screen: HomeScreen,
},
List: {
screen: ListScreen,
},
Settings: {
screen: SettingsScreen,
},
WordDetails: {
screen: WordDetails,
},
}, {
contentComponent: DrawerMenu,
drawerWidth: 200,
drawerPosition: "right",
contentOptions: {
activeTintColor: '#e91e63',
itemsContainerStyle: {
marginVertical: 0,
opacity: 0.6
},
iconContainerStyle: {
opacity: 0.6
},
style: {
flex: 1,
paddingTop: 35,
},
}
}
);
SingedOut导航器:
import React from 'react';
import { Platform, StatusBar, Easing, Animated } from 'react-native';
import { Ionicons } from '@expo/vector-icons';
import { StackNavigator } from 'react-navigation';
import Colors from '../constants/Colors';
import SignIn from '../screens/SignInScreen';
import Register from '../screens/RegisterScreen';
const headerStyle = {
marginTop: Platform.OS === "android" ? StatusBar.currentHeight : 0,
backgroundColor: '#2b303b',
};
export default StackNavigator(
{
SignIn: {
screen: SignIn,
navigationOptions: {
title: "Prijavi se",
headerStyle,
headerTitleStyle: {
color: '#f5f5f5'
},
},
},
Register: {
screen: Register,
navigationOptions: {
title: "Prijavi se",
headerStyle,
headerTitleStyle: {
color: '#f5f5f5'
},
},
}
},
{
headerMode: "none",
transitionConfig: () => ({
transitionSpec: {
duration: 1000,
easing: Easing.step0,
timing: Animated.timing,
},
screenInterpolator: sceneProps => {
const { layout, position, scene } = sceneProps
const { index } = scene
const height = layout.initHeight
const translateY = position.interpolate({
inputRange: [index - 1, index, index + 1],
outputRange: [height, 0, 0],
})
const opacity = position.interpolate({
inputRange: [index - 1, index - 0.99, index],
outputRange: [0, 1, 1],
})
return { opacity, transform: [{ translateY }] }
},
}),
}
);
从这个“设置”屏幕我想从“SignedOutNavigator”继续这个“登录”..
最佳答案
据我了解,您正在构建一个应用程序,其中某些屏幕仅在用户登录时可用。
因此,当用户注销时,您应该清除导航历史记录,以便用户无法使用返回硬件按钮返回导航。
你应该做这样的事情:
this.props.navigation.dispatch(NavigationActions.reset({
index: 0, key: null, actions: [ NavigationActions.navigate({ routeName: "SignedOut" }) ]
}));
关于authentication - 来自另一个文件的 React-Native react-navigation,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47651788/