Introducing KickStart — AI generated FormKit forms in seconds. Generate from a screenshot, edit with drag-and-drop or conversational AI, copy & paste as components or schema!
Try for free
useFormKitContext 可组合函数，用于访问父级 FormKit 组件的上下文对象 — 或树中的任何其他 FormKit 组件。可选地，您可以提供一个效果回调，当上下文可用时执行。useFormKitContextById 可组合函数，用于访问具有显式id的任何 FormKit 组件的上下文对象。可选地，您可以提供一个效果回调，当上下文可用时执行。useFormKitNodeById 可组合函数，用于访问具有显式id的任何 FormKit 组件的节点对象。可选地，您可以提供一个效果回调，当节点可用时执行。FormKit 组件的 type 属性添加智能感知自动完成功能（#1241）。@formkit/core 包中新增 stopWatch 函数，允许从 watchRegistry 函数注销收据。getNode<T>() 函数添加类型泛型。@nuxt/tailwindcss 的新集成，自动包含 formkit.theme.ts 文件在 tailwind content 中。currency 和 unit 图标。FormKit 和 FormKitMessages 组件添加新的 library 属性，允许您包含额外的组件用于输入模式，例如，在使用 sections-schema 修改输入时（#1145）（#1137）。FormKitTypeDefinition 的 FormKit 组件的 value 类型是从 FormKitTypeDefinition 推断出来的。changeLocale 中的错误，导致更新的语言环境在新节点上未被使用（#1143）。@formkit/icons 包的树摇动问题（#1184）。FormKitIcon 组件添加到 Nuxt 模块的 autoImport 功能中（#1168）。BeforeStepChangeData 的类型（#1224）。datetime-local 输入类型的类型（#1129）。@formkit/vue 的 peerDependency，以减少同一项目中多个 Vue 实例的事件（#1160）。role="button"（#1210）。FormKit 组件的 type 参数现在需要在 FormKitInputProps 类型中有一个匹配的类型以支持 TypeScript。如果您使用了自定义输入并为 FormKitInputProps 提供了模块增强，您将需要更新 FormKitInputProps 类型以包含您的类型。
FormKit 1.5.0带来了FormKit的新开发版本。在开发中，FormKit现在使用了包含额外开发者体验增强功能的不同版本的包。这与Vue本身拥有“开发”和“生产”版本的方式类似，它允许FormKit提供改进的开发者体验，例如改进的HMR支持和更好的错误信息。
现在为未来版本大幅改进的开发者体验奠定了基础。此版本还包括数十个错误修复和改进。
createInput现在支持第三个参数sectionsSchema，它允许你扩展createInput自带的默认部分（#882）。didMount和节点事件mounted，用于识别<FormKit>组件何时挂载到DOM上（#0b8753d）。node.children被@formkit/observer观察，这允许验证规则以响应性访问node.children。changeLocale可组合函数，它可以全局更改所有表单的区域设置，适用于Options API、Composition API和Nuxt自动导入（#1112）allow_non_alpha和allow_numeric。npx formkit create-app），以使用themes.formkit.com的主题系统。options（选择、复选框、单选框、自动完成等）的输入现在正确计算它们的__mask值（#1046）。@formkit/nuxt的实验性autoImport功能（1095等）。node.clearErrors()始终移除该节点本地的错误（#941）createInput()的类型定义（#1105）。data-complete（#1038）。true或false的情况下使用（#989）。Vitest不会自动使用Vite所使用的相同节点参数（条件）（参见#4971）。如果你在更新后发现你的测试失败了，你可以在你的vitest.config.js文件中添加以下内容：
export default defineConfig({
resolver: {
conditions: process.env.VITEST ? ['development'] : undefined
},
test: {
// ...vitest配置
}
})
Vite应该在~1.2.x或更高版本以使用此功能。
<KitchenSink> 组件，可以渲染 FormKit 输入的每一个样本（有助于样式设计）。state.required 属性（使得在必填输入项中添加星号变得更容易）。<input>、<select> 和 <textarea> 元素添加 aria-required 属性（#984）。<FormKitSummary> 组件中新增 force-show 属性，即使没有可见错误也强制显示摘要。formkit CLI 工具新增 create-theme 命令，从 @formkit/theme-starter 脚手架一个新主题。node.submit() 在自定义元素的阴影根内部失败的问题（#1057）。<FormKitProvider>（及相关提供者）传递的错误（#1013）。invalidDate 消息移至 validation 本地化键（#953）min 和 max 验证消息（英文）为 validation 本地化键（#953）incomplete-message 属性（在表单上）成为响应式的错误（#1047）。length规则计算输入中可用的字符数量。<KitchenSink>组件，用于渲染所有输入样本。file输入在outer部分有多个文件时，添加一个data-has-multiple属性。@formkit/nuxt在autoImport模式下的一个错误，其中SSR上下文在每个请求后都没有被重置，导致一些专业输入出现水合错误和破损的用户界面。select 输入现在支持分组选项 (<optgroup>) (#426)。@formkit/nuxt 包现在包含一个实验性的 autoImport 选项，该选项只在使用 FormKit 的页面上加载 FormKit，而不是全局加载。这将从您的入口文件中删除 FormKit。我们计划最终使这成为默认行为，并鼓励使用当前 nuxt 模块的所有人尝试新选项。createInput() 创建的输入添加 prefix-icon 和 suffix-icon 的支持。colorpicker 输入添加 Tailwind 支持。color 图标。<FormKitProvider :config="yourConfig"> ——一个定义新配置边界的组件。任何嵌套在 <FormKitProvider> 下的 <FormKit> 组件都将从这个位置继承它们的配置。<FormKitLazyProvider>，它检查更高级别的 <Suspense> 边界（如果没有找到，它会注入一个），并注入一个 <FormKitConfigLoader> 组件。<FormKitConfigLoader> 组件。一个执行配置文件动态导入的异步组件。注意：上述新组件目前处于实验阶段，API稳定后将进一步进行文档化。
<FormKit> 组件的TypeScript定义中的一个错误，该错误在Vue语言工具（Volar）> 1.8.11中导致TypeScript错误。@formkit/* 包的整体树摇动。alpha、alphanumeric 和 contains_* 验证规则在 latin 字符集中的错误。随着这次发布，我们正式宣布FormKit稳定且可投入生产使用。许多社区成员已经在生产环境中使用FormKit超过一年了，他们对结果非常满意。我们希望你也会喜欢！
此外，FormKit Pro现已对公众开放（无需早期访问权限）。FormKit Pro仍处于Beta阶段，我们正在努力准备它的稳定发布。
<FormKitSummary> 组件，它会自动列出表单中的所有错误和验证消息，并提供跳转链接到每个错误（a11y）。radio，checkbox和range输入的焦点样式（a11y）。4.5:1（a11y）。file输入现在在删除文件按钮中包含文件名（a11y）。file输入现在会重新聚焦（a11y）。StepHandlers、MultiStepHandlers和BeforeStepChangeData以协助输入多步骤。datetime-local输入无法解析其插槽类型。我们不谈论布鲁诺。
meta。元输入仅在内存中，并向您的表单添加数据，而无需向用户显示或在页面上渲染任何内容。元文档。text，number，range和hidden输入添加了一个新的number属性，该属性使用parseInt或parseFloat将值转换为数字，并扩展或收缩值的类型定义以匹配。id属性 (#908)。stepIndex和steps添加到step输入的类型定义中。nl语言环境的翻译。context.handlers.blur的类型定义中添加了可选的FocusEvent。barcode 输入，可通过 @formkit/barcode 包使用。Barcode 文档dropdown 输入功能：
@formkit/utils 中的 whenAvailable 工具动态引用其文档上下文，便于在 web 组件 shadow DOM 中使用 FormKit。#837dropdown、autocomplete 和 taglist 输入添加新的行为属性。repeater 输入添加了一个 #empty 部分/插槽，当没有值时显示上下文。Repeater 文档lt)repeater 尊重其父表单的禁用状态。#579taglist 接受空选项。#586autocomplete 输入与 Vue 的 @focus 指令兼容。#670taglist 接受其选项列表之外的值。#681datepicker 在 picker-only 模式下键盘导航的错误。#736actions 插槽中提交类型按钮的 pointer-events: none。#790taglist 在启用 open-on-click 时尊重最大 prop。#793selectionAppearance 设置为 option 的 autocomplete 以配合 open-on-click prop 使用。#817@formkit/utils 中的 eq 函数的问题。#819datepicker 在以 year 开始时的导航错误。#827taglist 在禁用 close-on-select 时尊重最大 prop。#838formkit-icon 类与 config.rootClasses 对齐。#859role="button" div，解决了 datepicker 的 Safari 焦点问题。#864dropdown、autocomplete、taglist）现在可以渲染不属于其选项列表的值。#877<FormKitRoot> 组件。此组件提供有关根元素（Document 或 ShadowRoot）的上下文。在自定义元素（Web 组件）内使用 FormKit 时，将一个或多个 FormKit 输入包装在 <FormKitRoot> 中以确保正确的功能。node.props.__root 和 context.__root 属性，引用节点当前的根元素（Document | ShadowRoot）。multi-step输入添加新的node.next()，node.previous()和node.goTo()扩展。这使得更容易外部控制multi-step输入导航。#685node.restoreCache()扩展，以允许在提交失败时将表单值恢复到缓存中。#727multi-step输入的SSR hydration问题。#720blur事件可能在路由更改时导致控制台错误的问题。#735beforeStepChange现在可以与async函数调用一起工作。#743file输入在调用reset后不允许重新上传相同文件的问题。#762fk-前缀，防止Genesis CSS关键帧命名冲突。text输入族的自定义输入重复使用第一个模式（#719）FormKitValidationMessage以帮助类型验证消息函数（#695）key，control，debounce，beforeSave和beforeLoad。group的输入。例如（form，group，multi-step等）。value属性不更新（#717）。dynamic列表属性允许您轻松创建自己的重复器。require_one（感谢@devoidofgenius），contains_alpha，contains_alphanumeric，contains_alpha_space，contains_symbol，contains_uppercase，contains_lowercase，contains_numeric，symbol，uppercase和lowercase（感谢@riderx）。textarea输入。commitRaw事件，即使输入值没有变化也会触发。FormKitSchema现在可以使用单个根节点（而不是片段）v-show这样的标准Vue指令现在可以工作，通常不再需要为动态输入添加key（#528）。node.reset()函数的值成为输入的新默认值（#621）。zh-TW)lv)tet)node.extend()扩展核心节点。