表单字段元素应具有 id 或 name 属性

Question

以下是我的代码。

<TextInput
          label="Password"
          placeholder="Enter your password"
          password={true}  //password passed to enable view password option
          value={password}
          handelChange={(e) => setPassword(e.target.value)}
        />

我收到以下错误消息； 表单字段元素既没有 id 也没有 name 属性。这可能会阻止浏览器正确自动填写表单。 要解决此问题，请将唯一的 ID 或名称属性添加到表单字段。这不是严格需要的，但即使您在同一元素上有自动完成属性，仍然建议这样做。

我尝试了以下方法，但它仍然给我一个错误；

<label htmlFor="password">Password</label>
<TextInput
  id="password"
  label="Password"
  placeholder="Enter your password"
  password={true}
  value={password}
  onChange={(e) => setPassword(e.target.value)}
/>

Answer 1

该问题与缺少 ID 和名称属性的表单字段有关，这可能会阻止浏览器正确自动填写表单。

如何解决这个问题是为你的表单元素添加一个 id 或名称，我假设你的

TextInput

组件有它们。

您不应通过

TextInput

组件传递此 ID 或名称，您应该编辑

TextInput

组件返回的表单元素。

我的建议是使用这种语法：

    <form>
    <input type="text" name="input-text1" />
    <input type="text" name="input-text2" />
    <input type="submit" name="input-submit" />
    </form>