Question

在Node上运行项目并在React上设置前端以设置.env变量，我使用Material UI构建了它，并且所提供的所有TextField都按预期工作并进行了特定的验证。除了使用与其他模式相同的模式的字段外，它不会获取任何输入或进行任何类型的验证。如果我遗漏某些东西或如何处理这个问题，有人可以指导我吗？

CMD python /usr/src/toplevel/manage.py runserver 0.0.0.0:8000

Answer 1

serviceHTTPSCaError州应该返回错误消息或false并且errorText应为errorText={this.state.serviceHTTPSCaError}

我做了一个检查电子邮件地址的例子

handleChangeServiceHTTPSCa(event) {
  if (!event.target.value.match(/^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/)) {
    this.setState({
      serviceHTTPSCa: event.target.value,
      serviceHTTPSCaError: 'Email address is not vaild',
    },()=>{
      if(this.state.serviceHTTPSCa === ''){ // check if the input is empty
        this.setState({ serviceHTTPSCaError: false})
      });
  } else {
    this.setState({ serviceHTTPSCa: event.target.value,serviceHTTPSCaError: false });
  }
}

在渲染回归中

 <TextField
            hintText="Email Address"
            fullWidth={true}
            value={this.state.serviceHTTPSCa}
            onChange={this.handleChangeServiceHTTPSCa}
            errorText={this.state.serviceHTTPSCaError}
            type="text"
          />

材质UI特定的Textfield验证意外行为

1 个答案: