React Native：为什么有时未定义 useState 钩子？

Question

在我的 React Native 应用程序中，我有两个组件A和B ：

export const A = () => {
  const [text, setText] = useState('');
  return (
    <View>
      <B
        _text={text}
        _setText={setText}
      />
    </View>
  )
}

const B = ({_text, _setText}) => {
  console log(_text, _setText);
  ...
  ...
}

我在B console.log _text和_setText 。 每当我打开B组件时，这个 console.log 都会被多次调用，有时它将_text和_setText都记录为undefined 。

有谁知道为什么会这样？

Answer 1

您很可能在更新文本状态之前渲染 B 组件。 要修复它，请检查它是否为空/空：

export const A = () => {
  const [text, setText] = useState('');
  return (
    <View>
      {text ? <B
        _text={text}
        _setText={setText}
      /> : null}
    </View>
  )
}