Question

我试图将子组件的初始状态设置为父组件传递的prop值。

export default (props) => {
  const myValueFromProp = props;
  const [myValue, setMyValue] = useState(myValueFromProp);

  return (
    <Text>
     {myValue}
    </Text>
  );
};

上面是我想出的代码。我对这是否是我应该遵循的正确方法感到困惑。

此特定组件内部还有更多基于状态的逻辑，为了简单起见，我省略了。

Answer 1

您需要考虑两件事。

您是否需要将道具作为状态存储在子组件中？（如果状态可以直接用于道具，则可能不需要它，因为您可以直接使用道具）
道具更改时是否需要更新状态？

一旦回答了两个问题，就需要更新useEffect中的状态

export default (props) => {
  const myValueFromProp = props;
  const [myValue, setMyValue] = useState(myValueFromProp);
  useEffect(() => {
     setMyValue(props);
  }, [...props])
  return (
    <Text>
     {myValue}
    </Text>
  );
};

使用useState Hook时基于prop设置初始状态

1 个答案: