React验证是否输入了其中一个输入字段

Question

我有一个场景，我必须验证其中一个输入字段是否输入了值。

在每个输入字段的OnBlur事件中，我获取值并设置为状态，同时我检查其中一个输入框中是否有值并设置inputIsReq状态。我在每个文本字段的必需属性中使用inputIsReq。在此更改后，我的页面加载速度非常慢，并且验证也不会发生。有什么想法解决这个问题？

Answer 1

您的代码运行缓慢，因为您正在调用方法changeInputValue而不是将其作为回调传递。

这将调用changeInputValue：

错误的： onBlur={this.changeInputValue("input_4_value", this)}

正确的： onBlur={() => this.changeInputValue("input_4_value", this)}

Abowe示例将changeInputValue作为回调传递。

你也可以 onBlur={changeInputValue}然后你无法通过任何参数回调

你在循环中调用changeInputValue，因为它已经改变了状态，然后组件被重新渲染等等......这也是在控制台中产生警告

  

warning.js：36警告：setState（...）：在现有状态期间无法更新   状态转换（例如在渲染或其他组件内）   构造函数）。渲染方法应该是道具的纯函数   州;构造函数的副作用是反模式，但可以移动   到componentWillMount。