FormKit 输入与 HTML 输入类似，但具有标签、帮助文本、验证和错误消息等许多必要功能（以及更多）。与 HTML 的 <input> 标签使用不同的 type 属性（例如 <input type="text"> vs <input type="checkbox">）类似，FormKit 使用 type 属性来定义 所有 输入。实际上，使用 FormKit，您只需要学习一个组件：
FormKit 输入不仅限于 "原生" HTML 中提供的功能。我们单独的 FormKit Pro 包提供了对 "合成" 输入类型（如 repeater、autocomplete、mask、rating 等）的访问权限。当然，您也可以通过创建自定义输入来编写自己的输入。
虽然您可以单独使用 FormKit 输入，但通常您会希望将它们组合成一个表单：
<FormKit type="form">
<!-- ... your form inputs -->
</FormKit>form 类型提供了许多功能，包括值收集、初始值设置、表单提交、错误处理、加载状态等。
有四种方法可以设置输入的值：
value 属性（注意：仅设置初始值）。v-model。node.input() 方法。FormKit 组件的值。value 属性您可以使用 value 属性设置单个输入或一组输入的初始值。
value 属性仅用于设置输入的初始值。它不会在组件创建后对更改做出反应。
v-model使用 v-model 可以实现与任何 FormKit 输入的双向响应式数据绑定。
node.input()在每个 FormKit 输入的核心是一个 FormKit 的 node 对象 的实例，使用 node.input() 方法是修改任何输入值的最有效机制（了解更多关于获取节点对象实例的信息）。
对 node.input() 的调用是防抖的，因此是异步的（使用 delay 属性来更改防抖的长度）。您可以使用 await node.input(val) 来确定输入何时稳定。
像 list、group 和 form 这样的父级输入也可以直接设置其子级的值。实际上，父级的值只是其子级的聚合值。您可以使用上述任何方法（value 属性、v-model 或 node.input()）来设置子级的值。
在几乎所有情况下，设置在 <FormKit> 组件上的属性将会传递给组件核心的 <input> 元素，而不是任何包装的 DOM 元素。例如：
我们在独立的文档页面中详细讨论了验证 —— 但是简单地说，在 FormKit 中为输入添加验证规则就像添加 validation 属性一样简单：
为了提高性能，所有的 FormKit 输入都支持防抖作为一项一流的功能。当输入的值在每次按键时改变（技术上是 input 事件），这个新的更新值只会在内部设置 —— 验证规则、组、列表、表单和（大多数）插件还没有“意识到”已经进行了更改。
在内部，FormKit 对 input 事件进行了防抖处理。当防抖“稳定”后，新的值被“提交”，然后通过 输入节点的 commit 事件通知应用程序的其余部分。默认的防抖延迟是 20 毫秒，可以通过 delay 属性或配置选项进行调整。
为了说明这一点，让我们从 #default 插槽属性中获取 group 的 value 并观察它在我们的 1000ms delay 之后才被更新：
delay 属性的默认值是 20 毫秒。然而，默认情况下，group 和 list 输入使用 0 毫秒，以防止防抖延迟在每个深度级别上“累积”。
验证错误不是设置输入错误的唯一方式。您还可以使用 errors 属性在输入上显式设置错误消息。
显式设置的错误是非阻塞的，这意味着它们不会像验证错误那样阻止表单提交。您可以在表单文档中了解更多关于错误处理的信息。
FormKit 输入接受通用属性（适用于所有 FormKit 输入）和特定于输入的属性。下表是所有 FormKit 输入可用的属性的综合列表。
| Prop | Type | 默认 | 描述 |
|---|---|---|---|
| config | Object | {} | 提供给 input 的节点和此输入的任何后代节点的配置选项。 |
| delay | Number | 20 | 在调度 commit hook 前，输入值的去抖动毫秒数。 |
| dirtyBehavior | string | touched | 确定此输入的“dirty”标志设置方式。可以设置为 touched 或 compare — 默认为 touched，性能更好，但无法检测表单是否再次匹配其初始状态。 |
| errors | Array | [] | 要在此字段上显示的错误消息的字符串数组。 |
| help | String | '' | 帮助文本与输入关联的文本。 |
| id | String | input_{n} | 输入的唯一标识符。提供一个 id 还可以全局访问输入的节点。 |
| ignore | Boolean | false | 防止将输入包含在任何父级（组、列表、表单等）中。在仅用于 UI 而不是实际值的情况下非常有用。 |
| index | Number | undefined | 如果父级是列表，允许在给定索引处插入输入。如果输入的值未定义，它将继承该索引位置的值。如果它有一个值，它将在给定索引处将其插入到列表的值中。 |
| label | String | '' | 与输入关联的 label 元素的文本。 |
| name | String | input_{n} | 输入的名称，在数据对象中唯一标识。在一组字段中应该是唯一的。 |
| parent | FormKitNode | contextual | 默认情况下，父级是包装组、列表或表单，但此属性允许显式分配父级节点。 |
| prefix-icon | String | '' | 指定放置在 prefixIcon 部分的 图标。 |
| preserve | boolean | false | 在输入卸载时，在父组、列表或表单上保留输入的值。 |
| preserve-errors | boolean | false | 默认情况下，使用 setErrors 在输入上设置的错误会在输入时自动清除，将此属性设置为 true 可以保留错误，直到明确清除为止。 |
| sections-schema | Object | {} | 一个包含部分键和模式部分值的对象，其中每个模式部分应用于相应的部分。 |
| suffix-icon | String | '' | 指定放置在 suffixIcon 部分的 图标。 |
| type | String | text | 要从库中渲染的输入类型。 |
| validation | String, Array | [] | 要应用于输入的 验证 规则。 |
| validation-visibility | String | blur | 确定何时显示输入的验证失败规则。有效值为 blur、dirty 和 live。 |
| validation-label | String | {label prop} | 确定在验证错误消息中使用的标签，默认情况下，如果可用，则使用 label 属性，否则使用 name 属性。 |
| validation-rules | Object | {} | 附加的自定义验证规则，可用于验证 prop。 |
| value | Any | undefined | 为输入和/或其子元素提供初始值。不是响应式的。可以种子 整个组（表单）和列表。 |
FormKit 输入会触发通用事件（从所有输入中触发的事件）和特定于输入的事件。下表是所有 FormKit 输入触发的事件的综合列表。
| Event | Payload | 描述 |
|---|---|---|
| input | any | Emitted when the core node’s commit hook is completed. Has it’s own debounce to reduce noise. Includes the core node as the second argument. |
| input-raw | any | Emitted on every core node’s commit hook. Includes the core node as the second argument. |
| node | FormKitNode | Emitted when the component’s setup is complete. This is the internal FormKitNode object at the heart of the input. |
输入由称为“部分”的 HTML 块组成。每个部分都有一个“键”，可用于针对各种目的定位部分，例如：
许多部分键是通用可用的，而其他部分键是特定于给定输入类型的（您也可以为自定义输入定义自己的部分键）。下表是所有输入通常可用的部分键的综合列表：
| Section-key | 描述 |
|---|---|
| outer | 最外层的包装元素。 |
| wrapper | 标签和输入周围的包装器。 |
| label | 输入的标签。 |
| prefix | 默认情况下没有输出，但允许直接在输入元素之前放置内容。 |
| prefixIcon | 输出在前缀部分之前放置一个图标的元素。 |
| inner | 实际输入元素周围的包装器。 |
| suffix | 默认情况下没有输出，但允许直接在输入元素之后放置内容。 |
| suffixIcon | 输出在后缀部分之后放置一个图标的元素。 |
| input | 输入元素本身。 |
| help | 包含帮助文本的元素。 |
| messages | 包装所有消息的容器。 |
| message | 包含消息的元素（或多个元素） - 最常见的是验证和错误消息。 |
有时您可能需要重新组织 FormKit 输入中的 HTML，例如添加、编辑、移动或删除部分。这可以通过导出输入（使用 CLI 工具）来完成，进行所需的更改，然后在项目中使用修改后的输入。阅读 导出输入指南 以了解详情。
可以使用插槽覆盖输入的结构。您可以使用 部分键 精确地指定插槽内容的位置。然后，插槽将传递 上下文对象 以在其模板中使用。
例如，如果我们想要使用插槽来定义输入的标签，我们可以使用 label 插槽来实现：
使用插槽的一个缺点是您通常需要重新创建不相关的功能以实现所需的更改。例如，使用插槽需要您重新实现应用于这些部分的任何类（可以通过使用 context.classes.sectionName 来完成）。
为了帮助解决这个缺点，FormKit 还能够 选择性地覆盖/扩展每个部分的底层模式，允许进行复杂的结构修改，通常不会丧失功能。
FormKit提供了一种额外的机制来改变FormKit输入的结构，称为“sections schema”。在幕后，所有的FormKit输入都由FormKit的schema驱动 - 这是一种用于创建和存储DOM结构和逻辑的JSON兼容数据格式。这允许极大的结构灵活性，因为所有的输入都可以通过section键扩展其schema的一部分，而无需完全替换模板。
例如，默认情况下，FormKit使用无序列表(<ul>和<li>)来输出验证消息 - 但是也许您需要使用<div>标签。您可以使用schema属性来更改这些标签，而无需重新创建任何功能：
为了实现可访问性和灵活性，FormKit使用了几个包装元素，比如wrapper和inner sections中的元素。然而，也许在某些输入中，您需要删除一个包装元素以确保其他元素是相邻的。您可以通过提供一个null值作为schema元素来实现这一点：
Section schemas还可以使用高级schema逻辑来改变输出的内容。例如，当您的输入值与特定字符串匹配时，您可以输出一个特殊值：