Question

我有此登录屏幕，它正在运行，但显示此警告，我对此感到担心。当单击headerRight按钮时，我必须注销并返回登录屏幕。

我已经尝试了该网站提供的所有内容

这是我的课程

class AuthLoadingScreen extends Component{
    constructor(props){
        super();
        this._loadData();   
    }

    _loadData = async() => {
        const isLoggedIn = await AsyncStorage.getItem('access_token');
        console.log(isLoggedIn);
        this.props.navigation.navigate(isLoggedIn == null? 'Login' : 'Home');
    }

    _removeToken = async(navigation) => {
        console.log('test');
        await AsyncStorage.clear();
        navigation.navigate('Login');
    }

    render(){
        return(
            <View><ActivityIndicator/></View>
        );
    } 
}

这是我调用_removeToken函数的地方

const StackNavigator = createStackNavigator({
    AuthLoading: AuthLoadingScreen,
    Login: {
        screen: Login,
    },
    Register: {
        screen: Register,
    },
    Home: {
        screen: TabNavigator,
        navigationOptions: ({navigation}) => ({
            title: 'Insta Clone',
            headerLeft: null,
            headerTitleStyle: { 
                textAlign:"center", 
                flex:1 
            },
            headerRight: (
                <Button
                    icon={
                        <Icon
                        name='sign-out'
                        type='octicon'
                        color='black'
                        />
                    }
                    onPress={() => (new AuthLoadingScreen)._removeToken(navigation)} // <--- HERE
                    buttonStyle={ {backgroundColor: 'transparent'} }  
                />
            ),
            headerLeft: (
                <Button
                    icon={
                        <Icon
                        name='info'
                        type='octicon'
                        color='black'
                        />
                    }
                    onPress={() => alert("Created by Matheus Melo")}
                    buttonStyle={ {backgroundColor: 'transparent'} } 
                />
            ),
        })
    },
});

Answer 1

您可以直接导航至Login，而无需使用AuthLoadingScreen引用，这是更新后的代码的外观：

const removeToken = async(navigation) => {
        console.log('test');
        await AsyncStorage.clear();
        navigation.navigate('Login');
    }
const StackNavigator = createStackNavigator({
    AuthLoading: AuthLoadingScreen,
    Login: {
        screen: Login,
    },
    Register: {
        screen: Register,
    },
    Home: {
        screen: TabNavigator,
        navigationOptions: ({navigation}) => ({
            title: 'Insta Clone',
            headerLeft: null,
            headerTitleStyle: { 
                textAlign:"center", 
                flex:1 
            },
            headerRight: (
                <Button
                    icon={
                        <Icon
                        name='sign-out'
                        type='octicon'
                        color='black'
                        />
                    }
                    onPress={() => removeToken(navigation)}
                    buttonStyle={ {backgroundColor: 'transparent'} }  
                />
            ),
            headerLeft: (
                <Button
                    icon={
                        <Icon
                        name='info'
                        type='octicon'
                        color='black'
                        />
                    }
                    onPress={() => alert("Created by Matheus Melo")}
                    buttonStyle={ {backgroundColor: 'transparent'} } 
                />
            ),
        })
    },
});

无法读取未定义的属性“导航”，即使它正在工作

1 个答案: