React钩子-不能在普通异步函数中使用钩子？
React钩子-不能在普通异步函数中使用钩子？
提问于 2020-04-17 12:46:35
我是钩子的新手，到目前为止，我对钩子印象不深，但是，如果我试图在函数中使用钩子(无效的钩子调用)，似乎会抱怨。钩子只能在函数组件的主体内调用。这可能是由于以下原因之一发生的)。
我在一个基本文件中有几个常用的API函数，用于从API中检索数据。它们不返回任何内容，只是将(useDispatch)分派到应用商店，使用此状态的关联组件将在整个应用程序中更新。我知道这可能是因为它没有返回React元素的原因，但有没有办法绕过这一点，或者是一个更好的、更“推荐”的React方法？如果我必须在父组件中手动传入用户并分派返回的结果，这并不是世界末日，但我宁愿将其保存在一个位置，并在此函数中处理所有这些结果，这样父组件所要做的就是在状态发生变化时进行更新。
这是函数：
export async function getCar(id) {
// It's complaining about these hooks
const { user } = useSelector(state => state.auth);
const dispatch = useDispatch();
try {
let response = await axios.get(`${baseURL}api/cars/getCar/${id}/${user.id});
if (response.data.successCode === 200) dispatch(setCar(response.data));
} catch (error) {
}
}用法：const carsList = getCar("id");
谢谢大家，非常感谢。
回答 1
Stack Overflow用户
回答已采纳
发布于 2020-04-17 12:54:17
钩子不同于函数。考虑到您想要实现一个自定义钩子，您首先需要在钩子名称前面加上use
其次，钩子不能返回异步值，除非你把它存储在状态中。此外，您还需要使用useEffect函数来确保api请求只触发一次，或者在id参数更改时触发。
export function useGetCar(id) {
// It's complaining about these hooks
const { user } = useSelector(state => state.auth);
const dispatch = useDispatch();
useEffect(() => {
async function myFn() {
try {
let response = await axios.get(`${baseURL}api/cars/getCar/${id}/${user.id});
if (response.data.successCode === 200) dispatch(setCar(response.data));
} catch (error) {
}
}
fn()
}, [id])
}另外，因为您只是更新状态，所以您可以编写另一个选择器来从redux store获取车值
用法：
const Comp = ({id}) => {
useGetCar(id);
const car = useSelector(state => state.car);
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/61272040
复制相关文章
点击加载更多
相似问题
如何从workfront api获取集合名称列表
如何从forerunnerdb获取集合名称
如何从以userid作为集合名称的集合中获取文档
如何从集合中获取api返回的数据？
从firebase文档中获取集合名称
添加站长 进交流群
领取专属 10元无门槛券
AI混元助手 在线答疑
关注 腾讯云开发者公众号
洞察 腾讯核心技术
剖析业界实践案例
腾讯云开发者
