Question

我在登录时在异步存储中设置我的值

fetch('http://xxxxx/xxxx/getUserDetails.php', {
                            method: 'POST',
                            headers: {
                                'Accept': 'application/json',
                                'Content-Type': 'application/json',
                            },
                            body: JSON.stringify({
                                user_id: this.state.userEmail,
                            })
                        })
                            .then((response) => response.json())
                            .then((responseJson) => {
                                const name = responseJson[0]['name'];
                                const profilePicture = responseJson[0]['profile_picture'];
                                const userId = responseJson[0]['id'];
                                const loginMode = responseJson[0]['login_mode'];
                                AsyncStorage.setItem('active', 'true');
                                AsyncStorage.setItem('userEmail', this.state.userEmail);
                                AsyncStorage.setItem('name', name);
                                AsyncStorage.setItem('profilePicture', profilePicture);
                                AsyncStorage.setItem('userID', userId);
                                AsyncStorage.setItem('loginMode', loginMode)
                                setTimeout(async () => {
                                    this.setState({ isLoading: false })
                                    this.props.navigation.navigate('userScreen');
                                }, 500)
                            })
                            .catch((error) => {
                                console.log(error);
                            })
                    }

并在注销时将其删除。

fetch('https://xxxxxx/xxxx/userLogout.php', {
            method: 'POST',
            headers: {
                'Accept': 'application/json',
                'Content-Type': 'application/json',
            },
            body: JSON.stringify({
                email: userEmail
            })
        }).then((response) => response.json())
            .then(async (responseJson) => {
                try {
                    const keys = await AsyncStorage.getAllKeys();
                    await AsyncStorage.multiRemove(keys);
                    this.props.navigation.toggleDrawer();
                    this.setState({ isLoading: false })
                    this.props.navigation.navigate('loginScreen');
                } catch (error) {
                    console.log("Error clearing app data");
                }
            }).catch((error) => {
                console.log(error);
            })

但是如果我使用新用户登录，则旧用户的详细信息会显示在登录页面中。如果我重新加载我的应用，那么存储在异步存储中的新值会显示为什么会发生这种情况，而不会发生这种情况？

我在这里使用AsyncStorage。

async componentDidMount() {
        const userEmail = await AsyncStorage.getItem('userEmail');
        const name = await AsyncStorage.getItem('name');
        const profilePicture = await AsyncStorage.getItem('profilePicture');
        const userID = await AsyncStorage.getItem('userID');
        this.getWish();
        this.getAddFunction();
        this.setState({ userEmail })
        this.getResumeVideo(userEmail);
        this.getDemoVideo();
        this.getClass();
        this.setState({
            userEmail,
            name,
            profilePicture,
            userID
        })
        this.getNotificationCount(userID);
        Orientation.lockToPortrait();
        this._unsubscribe = this.props.navigation.addListener('focus', () => {
            this.getAddFunction();
            this.getDemoVideo();
            this.getResumeVideo(this.state.userEmail);
            this.getClass();
            this.getNotificationCount(userID);
        });
    }

Answer 1

您正在调用setState的唯一地方，告诉React应该在componentDidMount处声明（并渲染...）新值，因此React不知道它应该再次渲染。

将新值分配给AsyncStorage时，您也可能会调用setState

fetch('http://xxxxx/xxxx/getUserDetails.php', {
                            method: 'POST',
                            headers: {
                                'Accept': 'application/json',
                                'Content-Type': 'application/json',
                            },
                            body: JSON.stringify({
                                user_id: this.state.userEmail,
                            })
                        })
                            .then((response) => response.json())
                            .then((responseJson) => {
                                const name = responseJson[0]['name'];
                                const profilePicture = responseJson[0]['profile_picture'];
                                const userId = responseJson[0]['id'];
                                const loginMode = responseJson[0]['login_mode'];
                                AsyncStorage.setItem('active', 'true');
                                AsyncStorage.setItem('userEmail', this.state.userEmail);
                                AsyncStorage.setItem('name', name);
                                AsyncStorage.setItem('profilePicture', profilePicture);
                                AsyncStorage.setItem('userID', userId);
                                AsyncStorage.setItem('loginMode', loginMode)
                                setTimeout(async () => {
                                    this.setState({ isLoading: false })
                                    this.props.navigation.navigate('userScreen');
                                }, 500)

                             // here
                               this.setState({
                                 name,
                                 profilePicture,
                                 userID
                              })
                            })
                            .catch((error) => {
                                console.log(error);
                            })
                    }

AsyncStorage仅在重新加载应用程序时有效

1 个答案: