reactjs - 设置钩子的状态一次

Question

我不明白为什么当我运行时：

  interface Xxx {
    str: string
  }

  const [xxx, setXxx] = useState<Xxx>();

  function getData() {
    setXxx({
      str: "aaa"
    });
  }

  getData()

然后钩子一直被设置，永远。怎么跑getData一次？

标签： reactjs

Answer 1

要在组件 init 上只执行一次方法，可以使用钩子 useEffect ：

useEffect(() => {
  getData()
}, []);

这类似于 react 生命周期方法componentDidMount。

一些文档：https ://reactjs.org/docs/hooks-effect.html#tip-optimizing-performance-by-skipping-effects