小编Mig*_*GEQ的帖子

useEffect的返回函数在组件挂载时运行吗?

这是我的代码

import { useEffect } from "react";
import { Link } from "react-router-dom";

export const PageOne = () => {

    useEffect(() => {
      return () => {console.log("PageOne")}
    }, []);

    return (
        <>
            <h1>PageOne</h1>
            <Link to="/two">Page two</Link>
        </>
    );
}
Run Code Online (Sandbox Code Playgroud)

这是我访问 PageOne 时在控制台中看到的内容

PageOne
Run Code Online (Sandbox Code Playgroud)

这是当我从 PageOne 导航到 PageTwo 时在控制台中打印的内容(PageOne 和 PageTwo 具有相同的结构)

PageOne
PageTwo 
Run Code Online (Sandbox Code Playgroud)

所以我认为 useEffect 中定义的返回函数在组件安装和卸载时运行。我在这个项目中使用了react-router-dom和Vite。

这是正常的吗?并且,是否存在一种仅在组件被卸载时才运行副作用函数的方法?

抱歉,如果我犯了一些错误。我是一名新开发人员,也是一名英语学生。

reactjs use-effect

5
推荐指数
1
解决办法
1045
查看次数

标签 统计

reactjs ×1

use-effect ×1