反应/功能组件/道具改变/ getDerivedStateFromProps

Question

可以说我正在做一个简单的 CRUD 应用程序。我的 功能 组件基本上只是表单。

• 在 CREATE 案例中，我通过 props 传入一个空对象
• 在 UPDATE 案例中，我通过 props 传入了一个带有值的对象（我通过 API 调用在父组件中获取了数据）

我看起来像这样：

 const MyForm = (props) => {

 const [myValues, setMyValues] = useState(props.myValues);
 const [errors, setErrors] = useState(0);
 (...)
}

在 UPDATE 的情况下，我（当然）遇到了这样一个问题，即当组件被安装时 props.myValues 仍然是空的，并且当来自父组件的 api 调用完成时不会再次设置（更新）从而使表单值为空.

使用类组件，我将使用 getDerivedStateFromProps() 解决该问题。功能组件中有类似的东西吗？还是我从一开始就做错了？感谢您的任何建议！

原文由 Thread Pitt 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

是的，您当然可以使用 useEffect 。

在您的情况下，代码应如下所示：

 const MyForm = (props) => {

 const [myValues, setMyValues] = useState(props.myValues);
 const [errors, setErrors] = useState(0);

 useEffect(() => {
   setMyValues(props.myValues);
 }, [props.myValues]);

}

原文由 Vishal 发布，翻译遵循 CC BY-SA 4.0 许可协议