javascript - 反应材料ui文本字段（类型=数字）验证10个字符是否存在

Question

<TextField
    variant="outlined"
    required
    fullWidth
    id="accno"
    label="Main Account No"
    type="number"
    name="accno"
    //inputProps={{ className:"input-acc", pattern: "^.{0,10}$"}}
    autoComplete="accno"
    onChange={(e) => this.handleChange(e)}
    onInput={(e)=>{ 
        e.target.value = Math.max(0, parseInt(e.target.value) ).toString().slice(0,10)
    }}
    min={10}
/>

react material ui Textfield (type=number) validate 10 characters are existing (mandatory).Otherwise i need form validation to show error. I tried regex pattern it wont work because this field type is number.

标签： javascripthtmlreactjsformsmaterial-ui

Answer 1

直观的方法是检查值的长度handleChange

onChange={(e) => {
if(e.target.value.toString().length >= 10){
  //display error
 }
this.handleChange(e)
  }
}

您可能还需要error在 TextField 中添加属性