javascript - react : Input type number, maxLength 不起作用?

标签 javascript html reactjs

<分区>

假设我试图在输入字段中获取 10 个数字,但 maxLength 属性不适用于 type='number',尽管它适用于 type='text'。

import React, { Component } from 'react'
export default props => {
  const {
    handleInput
  } = props;

  return (
    <div>
      <span>+92</span>
      <input type='number' placeholder='Phone Number' maxLength={10} onChange={handleInput}/>
    </div>
  )
}

我在上面编写的代码片段中缺少什么?

一种可能的解决方法是我在输入标记中使用值属性并将输入类型设置为文本,并通过编写 onChange 函数继续测试来自正则表达式的输入值。

最佳答案

这是一个普通的 HTML 元素,与 React 无关。

对于输入,类型编号被忽略,您应该实现自己的验证。 根据 Mozilla 文档:https://developer.mozilla.org/en-US/docs/Web/HTML/Element/Input#attr-maxlength

关于javascript - react : Input type number, maxLength 不起作用?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54847834/

相关文章:

javascript - 将图标附加到按钮

javascript - 如果选中该 DIV 内的单选按钮,则单击按钮即可依次更改 DIV 内容

css - 使用 CSS 模块时从父项覆盖样式的 'correct' 方法是什么?

javascript - 拆分 Reducer 时出错

javascript - Material-ui 中基于类的样式

javascript - Cubism 未在回调上绘制更新数据

javascript - 多个div Vticker的jquery选择器

html - ngbDatepicker : Differentiate between invalid date format and out of range(minDate/maxDate) value for user feedback

html - 在中心垂直对齐文本 - 图像顶部?

javascript - 如何使用 jquery 将我的简单输入转换为输入组 Bootstrap