在我的React/Redux应用程序中，我有一个文本输入，其默认值通过Ajax调用检索。用户可以编辑输入中的默认值，然后通过单击"提交"链接提交更新的值。我正在努力为此使用不受控制或受控的输入。
- 将不受控制的输入与 defaultValue 一起使用：当默认值的数据从初始 Ajax 调用返回时，组件不会重新渲染（详见此处的官方文档）。因此，输入字段始终为空。
- 使用值绑定到组件 props 的受控输入：这确实正确给出了默认值，但是由于我无法更改 props，因此该字段基本上是"锁定"的。我可以通过触发一个操作来修改 onChange 处理程序中的全局状态并强制整个组件重新渲染来解决此问题，但这再次带来了其他问题。一方面，在 onChange 中这样做似乎有些过分，而且我不想在用户单击提交链接之前承诺更改状态。
有什么建议我可以在这里做什么吗？
正如文档所说，defaultValue仅在初始渲染时有用。因此，如果要使用defaultValue则必须将该特定组件的渲染延迟到加载数据之后。考虑将加载 gif（或类似的东西）放在 AJAX 调用的表单中。
我不认为第二种方式 - 使用value和onChange更新 - 像你说的那么糟糕;这通常是我写表格的方式。但是，这里真正的问题再次是延迟加载。加载初始值时，用户可能已经填写了该输入，只是看到它被收到的 AJAX 值覆盖。不好玩。
在我看来，最好的方法就是不使用AJAX。将初始数据作为全局变量追加到网页本身。这听起来像是一种反模式，但您只读取全局一次，并且可以节省 AJAX 请求的成本。在 Redux 中，有一种方便的方法可以做到这一点，我在这里和这里记录了它。
只是为了补充大卫的答案。
有时，进行 AJAX 调用以加载默认值确实有意义。例如，您可以调用某些服务以获得多语言支持，在数据库中创建一个具有默认值的元素等。
我会采用 value-onChange 方法，并阻止用户在加载值之前对其进行编辑：
-
通过禁用输入，直到 AJAX 调用返回。只需将禁用的属性绑定到显示默认值已加载的某个 prop 即可。
-
在 AJAX 调用返回之前不呈现输入。当您从服务器获取默认值时，您可以修改状态，以便它触发重新渲染。