我实现了一个表单，用户只能输入最多两位小数的数字（即有效金额），我使用Next.js（React）作为我的JS框架。
我发现，当输入一个小数点超过两位的数字时，下面的示例会打开一条验证消息，通知我输入无效。当单击提交按钮时，消息再次打开，表单无法提交（"submitted form"不会在控制台上打印）。

<form
  onSubmit={(e) => {
    e.preventDefault();
    console.log('submitted form');
  }}
>
  <input
    type="number"
    step={0.01}
    id="amount"
    name="amount"
  />
  <button type="submit">submit</button>
</form>

但是，一旦我使用value和onChange属性控制输入的值，如下所示：
x一个一个一个一个x一个一个二个x
验证step属性不再影响表单的有效性。如果我设置了任何其他验证属性，如min/max/required，表单仍然无法提交，除非满足要求，但当我输入的值有太多小数点时，表单可以通过submit按钮提交。
我还尝试在每次更改时打印输入的有效性，一旦小数点超过2（使用input.checkValidity()检查），输入就被标记为无效，但表单被标记为有效，可以提交。
我在任何地方都找不到任何关于这个的东西，特别是因为这似乎是step属性独有的。而且，我很难想象这是html表单的预期行为...
任何帮助将不胜感激!
编辑：我刚刚注意到一些更奇怪的行为：当我提交值为10.12345的表单，然后删除多余的数字（所以我只剩下10.12），然后尝试通过在输入中按Enter键提交表单时，它告诉我值无效，下一个有效数字将是10.11345和10.12345