正则,input 如何只能输入数字(包括小数点)

场景:

  需要在<input/>控制输入的内容为数字(包括小数点)

inputOnChange = (value) {   //只能输入 数字 或者 .
    value = value.replace(/[^0-9.]/g, "").trim()
  //value = value.includes(".") ? `0.${value.split(".")[1].slice(0, 4)}` : value
  //小数最多可输入4位。(不用.toFixed() 因为不用强制保留4位小数)
this.setState({ value }) }
inputOnBlur = (value) { //失焦的时候 展现正确的数据格式
  value = Number(value).toString(); //这里可以不变回字符串,担心数据要进行其它操作,统一数据类型
  this.setState({
    value
  })

}
----------------------------------------------------------- <input value={this.state.value} // 在输入框加载的时候输入框中的值。提交时可直接获取。
placeholder="请输入" // 在输入框为空的情况下会显示placeholder中的值。但是提交时不能直接取其值。
  onFocus={(ev)=>{ev.target.select()} //聚焦时为选中状态
  onChange={(ev)=>{this.inputOnChange(ev.target.value)}}
  onBlur={(ev)=>{this.inputOnBlur(ev.target.value)}}
/>

 

posted @ 2019-10-09 16:55  真的想不出来  阅读(6123)  评论(0编辑  收藏  举报