Reactjs 在then或catch方法中使用state

请需要您的帮助来解决内联错误

当我在in-then或in-catch方法中使用useBurgerState时，我有以下错误

ESLint:React钩子“useBurgerState”不能在回调内调用。必须在React函数组件或自定义React钩子函数中调用React钩子。（React钩子/钩子规则）

以下是整个功能：

const-BurgerBuilder=props=>{
常量[BurgerState，useBurgerState]=useState({
成分：{
沙拉：0，
肉类：0，
培根：0，
奶酪：0
},
价格:0,，
购买：假，
莫代尔：错，
微调器：错误
});
常量ContinueHandler=（）=>{
//警报（'继续！！'）
常量顺序={
配料：{…BurgerState.配料}，
价格：汉堡州
};
Useburger州({
配料：汉堡州，配料，
价格：BurgerState.price，
购买：BurgerState.purchased，
莫代尔州，莫代尔州，
微调器：是的
});
实例
.post（“/orders.json”，order）
。然后（响应=>{
Useburger州({
配料：汉堡州，配料，
价格：BurgerState.price，
购买：BurgerState.purchased，
莫代尔：错，
微调器：错误
});
})
.catch（错误=>
Useburger州({
配料：汉堡州，配料，
价格：BurgerState.price，
购买：BurgerState.purchased，
莫代尔：错，
微调器：错误
})
);
};
常量ZeroComponents={…BurgerState.Components}；
for（让索引为零）{
ZeroComponents[index]=ZeroComponents[index]仅在顶层调用挂钩

不要在循环、条件或嵌套函数中调用钩子。相反，请始终在React函数的顶层使用钩子。通过遵循此规则，可以确保每次呈现组件时都以相同的顺序调用钩子。这就是React正确保留sta的原因多个useState和useEffect调用之间的钩子数

（如果您好奇，请查看官方文件）

您可以在
then（）内部调用
setBurgerState（）
，就像

axios
.post('/orders.json',order)
.then(res=> setBurgerState(res.data))
.catch(err=>console.log(err)

仅在顶层调用挂钩

不要在循环、条件或嵌套函数中调用钩子。相反，请始终在React函数的顶层使用钩子。通过遵循此规则，可以确保每次呈现组件时都以相同的顺序调用钩子。这就是React正确保留sta的原因多个useState和useEffect调用之间的钩子数

（如果您好奇，请查看官方文件）

您可以在
then（）内部调用
setBurgerState（）
，就像

axios
.post('/orders.json',order)
.then(res=> setBurgerState(res.data))
.catch(err=>console.log(err)

这是因为你如何命名你的州设置者，
useBurgerState

我必须以“use”开头命名我的自定义挂钩吗？请这样做。这个
习俗很重要。没有它，我们就无法做到
自动检查是否违反挂钩规则，因为我们
无法判断某个函数是否包含对
它

从

我知道您不是在创建自定义钩子，但是您使用的命名约定表明不是这样，linter正在标记它认为在嵌套函数中调用的钩子

useState
变量的标准约定与大多数变量命名约定相同（camelCase）。此处的setter变量以
set
前缀开始

const [state, setState] = useState();
const [root, setRoot] = useState();
const [burgerState, setBurgerState] = useState();

这使得一眼就能看出什么是
useState
hook setter。
这是因为您如何将状态setter命名为
useState

我必须以“use”开头命名我的自定义挂钩吗？请这样做。这个
习俗很重要。没有它，我们就无法做到
自动检查是否违反挂钩规则，因为我们
无法判断某个函数是否包含对
它

从

我知道您不是在创建自定义钩子，但是您使用的命名约定表明不是这样，linter正在标记它认为在嵌套函数中调用的钩子

useState
变量的标准约定与大多数变量命名约定相同（camelCase）。此处的setter变量以
set
前缀开始

const [state, setState] = useState();
const [root, setRoot] = useState();
const [burgerState, setBurgerState] = useState();

这使我们很容易一眼就知道什么是
useState
hook setter。
谢谢你，瓦希德，谢谢你的回答，但是你的代码和我的有什么区别谢谢你，瓦希德，谢谢你的回答，但是你的代码和我的有什么区别