在 useEffect 中使用 useState答案

【问题标题】：Using useState in useEffect在 useEffect 中使用 useState
【发布时间】：2020-08-14 22:26:24
【问题描述】：

我正在使用 useState 从 TextInput 设置文本，并且我正在使用 useEffect 覆盖后退按钮的行为。

const [text, setText] = useState("");

  <TextInput
    onChangeText={text => setText(text)}
    defaultValue={text}
  /> 

  const printVal() {
    console.log("text is " + text);
  }

 useEffect(() => {
    navigation.setOptions({
      headerLeft: () => (
        <HeaderBackButton onPress={() => printVal()} />
      )
    });
  });

这总是导致记录的文本是 useState 的初始值。如果我不使用 useEffect 它可以工作，但我不想在每次更改时都设置导航选项。我可以在我的 useEffect 中从 useState 获取当前值，还是需要其他解决方案？

【问题讨论】：

标签： react-native react-navigation

【解决方案1】：

您忘记将依赖项作为第二个参数添加到 useEffect。如果你希望你的函数在组件加载时只被调用一次，你可以添加一个空数组，或者对于这个例子，你应该添加文本作为依赖，因为useEffect 依赖于这个值

 useEffect(() => {
    navigation.setOptions({
      headerLeft: () => (
        <HeaderBackButton onPress={() => printVal()} />
      )
    });
  }, [text]);  //<- empty array here

【讨论】：

啊当然，谢谢 =)。我以为我只需要设置一次，然后将其指向可以随时更新的内容，