从函数调用时，reactjs 状态不会更新

Question

上下文

这是我从另一个组件调用函数 invoked(..) 的 。在 invoked 内部，我设置了 State，但状态未设置。它不会触发 useEffect，也不会获取 useInterval 中的更新值。

下面是代码。

组件 1 = exampleComp.ts

const exampleComp = ({initValue: ExampleProps}) {
  const [params, setParams] = useState<{field1: null | string}> ({field1: null});

  const invoked = (x: string) => {
    console.log("inside invoked"); // this gets printed
    setParams({"field1": x});
  };

  useEffect(() => {
    console.log(params); // does not come here :(
  }, [params]);

  const fetchData = {...};

  useInterval(
      () => {
        if (!params.field1 || fetching) return;
        console.log("in interval", params); // does not come here too :(
        fetchData(params.field1);
      },
      params && !fetching ? 5000: null,
    );

    return {invoked, ...}
}

组件 2：

const newComp  = ({initValue: ExampleProps}) {
  const {invoked, ..} = useExampleComp({...}); //Example comp is the above component.
  useEffect(() => {
    invoked(x);
  }, []);
}

任何帮助将不胜感激！谢谢。

Answer 1

事实证明该组件卸载得太早了。当组件的范围太窄时就会发生这种情况。

如果您遇到类似的问题，请尝试记录该组件以查看是否确实发生了这种情况。