如何只允许编辑输入标签中点后的数字？答案

【问题标题】：How to allow editing only numbers after dot in input tag?如何只允许编辑输入标签中点后的数字？
【发布时间】：2022-11-16 11:05:58
【问题描述】：

目前我有一个输入标签，在那里我只允许 0.1、0.123、0.2、....（这样的数字）之类的数字。我为此输入标签使用了 react-hook-form。 `

 <input
      type="text"
      {...register("version")}
      onChange={(e: any) => {
       setValue("version", e.target.value)
      }}
      className={`form-control project-form-control rounded-0 input-digga2 ${
       errors.version ? "is-invalid" : ""
       }`}
      name="version"
      pattern="[0-9.]"
      />

当我执行 onChange 时我想做的是有一种方法我只能允许用户更改点后的数字并且它仍将保持为“0.”。

【问题讨论】：

标签： reactjs input react-hook-form

【解决方案1】：

您可以使用正则表达式，如下所示。

if (value.match(/w../) && !value.match(/[A-Za-z].d/)) {
      return;
}

我创建了一个沙箱代码并且它有效，检查一下：

https://codesandbox.io/s/stackoverflow-response-or8pzh

我还重新排序您的代码以提高代码的可读性。当你使用 React 时，让我给你一些建议。

避免在渲染 HTML 语法代码中放置函数和验证，这是许多开发人员难以理解代码的原因之一。

【讨论】：