reactjs react的useEffect钩子句柄值如何改变?

5lhxktic  于 2023-01-08  发布在  React
关注(0)|答案(1)|浏览(139)

我有一个状态值

const [fromAirport, setFromAirport] = useState<Airport | null>(null);

我还有一个自定义钩子,它在每次传入参数的值发生如下变化时注销该参数的值

export const useUpdateLogger = (value: any) => {
  useEffect(() => {
    console.log(value);
  }, [value]);
};

然后我就像这样使用useUpdateLogger(fromAirport);

    • 问题**:* * 我的状态变量的默认值是null。那么为什么null值被注销而变量却没有改变呢?**因为它只是null,那么为什么我们注销null而我没有改变变量的变量为其他任何东西呢?请解释。
ecr0jaav

ecr0jaav1#

原因是,useEffect在组件第一次加载时执行。
例如,将在component mountcomponent unmount上调用以空数组作为第二个参数的useEffect。
例如:

useEffect( () => {
    console.log("mounts");

    return () => console.log("unmounts");
 , []}

second argument不为空时,则调用useEffect,当组件mounts时调用一次,每次变量值改变时调用一次,最后当组件unmounts
PS:第二个参数中的变量应该在数组中传递,并且应该是一个状态或属性,属性是父组件中某个位置的状态变量。
例如:
x一个一个一个一个x一个一个二个x

相关问题