Question

我遇到一个问题，其中某些文件正在使用新的useEffect，而某些文件正在使用较旧的componentDidMount，我对useEffect更为熟悉，并且在下面具有以下异步功能：

 const [user, setUser] = useContext(UserContext);
 useEffect(() => {
     const fetchUser = async () => {
         const user = await Auth.currentAuthenticatedUser();
         getUserData(user.username).then((user) => {
             setUser(user);
         });
     };
     fetchUser();
 }, []);

上面的功能是我要在下面复制的内容：

this.state = {
    user: null,
};

async fetchUser() {
    try {
        const user = await Auth.currentAuthenticatedUser();
        const res = await getUserData(user.username);
        this.setState({ user: res });
        console.log(user);
    } catch (error) {
        console.error(error, 'Error: cant retrieve user data');
    }
}

async componentDidMount() {
    await this.fetchUser();
}

但是，我无法使用componentDidMount函数检索相同的结果，我该怎么做？

Answer 1

如果您使用的是class field declarations，则不能使用"extractCss": true,：

this

否则，您的代码看起来不错。进行此更改应该可以工作！

将useEffect函数转换为componentDidMount

1 个答案: