时间戳

首页 > 解决方案 > 如何在 React 函数组件中不使用 useEffect 钩子获取数据？

javascript - 如何在 React 函数组件中不使用 useEffect 钩子获取数据？

问题描述

我知道使用钩子时的常规方法是使用钩子获取数据useEffect。但是为什么我不能只在功能组件中调用 axios 而不是一个钩子，然后设置数据。

基本上，我在问这样做有什么问题：

const [users, setUsers] = useState(null);
axios.get("some api call")
  .then(res => setUsers(res.data))

在这里，我不使用useEffect，会出什么问题？

标签： javascriptreactjsaxiosreact-hooksuse-effect

解决方案

更喜欢useEffect(() => code... , []).

也就是说，您也可以在避免无限循环的同时做到这一点，但这是一种非常糟糕的做法，我不推荐这样做。

是的，您将进行重新渲染，但不会出现无限循环。使用useState 的惰性初始化函数。

const [users, getUsers] = useState(() => {
   axios.get("some api call")
     .then(res => getUsers(res.data))
});

推荐阅读