何时以及为什么使用效果

问题描述 投票:1回答:1

这似乎是一个很奇怪的问题,但是我在React中并没有看到很多useEffect的用例(我目前正在开发数千行的React代码库,并且从未使用过一次),我认为可能有些事情我没有完全掌握。

[如果您正在编写功能组件,那么将“效果”代码放入useEffect钩子与仅在功能组件的主体中执行该代码(在每个渲染器上都执行)有什么区别?

[一个典型的用例是在安装组件时获取数据:我看到了两种方法,一种使用useEffect,而另一种不使用:

// without useEffect
const MyComponent = () => {
    [data, setData] = useState();
    if (!data) fetchDataFromAPI().then(res => setData(res));

    return(
        {data ? <div>{data}</div> : <div>Loading...</div>}
    )
}
// with useEffect
const MyComponent = () => {
    [data, setData] = useState();
    useEffect(() => {
    fetchDataFromAPI().then(res => setData(res))
    }, []);

    return(
        {data ? <div>{data}</div> : <div>Loading...</div>}
    )
}

在这种用例中,useEffect有(在性能方面还是其他方面的优势?

javascript reactjs react-hooks
1个回答
0
投票

useEffect正在处理问题的副作用。 useEffect是componentDidMount

© www.soinside.com 2019 - 2024. All rights reserved.