时间戳

首页 > 解决方案 > 即使状态没有改变，反应也会改变受控输入值吗？

javascript - 即使状态没有改变，反应也会改变受控输入值吗？

问题描述

因此，如果每个 UI 更新必须仅在组件的“状态”或“道具”发生更改时发生，那么为什么受控输入会更改回状态内部的值，当状态未更新且没有任何内容触发更新时循环？

标签： javascriptreactjsformsinput

解决方案

在受控组件中，该值等于您作为道具传递给它的值。

如果该值没有改变，那么该受控组件的值也不会改变。

因此，通常在受控组件中，您将作为 onChange 道具传递一个回调函数来更改值。如果该回调函数不更改值，则输入的值不会更改。

例如

const App = () => {
  const [value, setValue] = useState("");
  return (
    <div>
      <input value={value} onChange={(e) => {}} />
    </div>
  );
};

无论我们如何尝试写入此输入，它的值都将始终保持为空字符串“”。由于 on change 方法不会更新值状态。

所以要明确你的问题，状态并没有恢复到初始值，而是它永远不会改变，html元素也是如此 - 输入的值永远不会改变。

代码笔示例： https ://codepen.io/besnikkorca/pen/rNOVXzx

推荐阅读