node.next()
、node.previous()
和 node.goTo()
扩展,用于 multi-step
输入,以便更容易地外部控制 multi-step
输入的导航 - #685node.restoreCache()
扩展,允许在提交失败时将表单值恢复到缓存中 - #727multi-step
输入的 SSR 水合问题 - #720blur
事件可能在路由更改时导致控制台错误的问题 - #735beforeStepChange
现在可以与 async
函数调用一起使用 - #743file
输入在调用 reset
后无法重新上传相同文件的问题 - #762fk-
前缀,防止 Genesis CSS 关键帧命名冲突。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
现在可以工作,通常不再需要为动态输入添加 key
(#528)。node.reset()
函数的值将成为输入的新默认值(#621)。zh-TW
)lv
)tet
)node.extend()
扩展核心节点的新功能。@input
事件的噪音,并移除了现在不再需要的 change 事件的防抖动。@formkit/observer
现在将观察对 node._value
的更改,以便在您希望对非防抖输入值进行操作时进行操作。@formkit/icons
中的 range
图标已更新,现在只显示一个控制手柄,因为 HTML 范围输入不支持多个值。旧的多控制手柄图标已用于新的 slider
FormKit Pro 输入。repeater
输入无法正确水合的 bug(#458)。repeater
输入时引发错误的 bug(#457)。@blur
事件时,blur 事件会多次触发的 bug(#413)。v-model
只在每隔一个输入时触发 input 事件的 bug(#463)stopOnFalse
时,node.walk()
提前结束的问题。Beta 16是FormKit的第一个没有预发布标识符的版本。Beta 16和所有剩余的beta版本将在0.x.x
语义版本下发布。首个稳定版本将是1.0.0
,计划于今年晚些时候发布。这种版本变更应有助于完成我们的beta发布周期时的软件包管理器依赖解析。
overlay
选项支持多种颜色。dirty-behavior
属性,允许用户选择compare
行为,该行为将当前输入的值与原始输入的值进行比较。如果将输入更改回其原始状态,则context.state.dirty
标志将恢复为false。options
属性(用于select、radio、checkboxes和一些pro输入)现在可以区分null
和undefined
值。@formkit/nuxt
模块和语法高亮的问题。dirty
状态不正确地设置为true
(#520)。submitted
状态(#503)。此版本向@formkit/addons
包添加了新的第一方插件,并为CSS和Tailwind CSS用户提供了错误修复和样式更新。
@formkit/addons
中的新的多步骤插件轻松创建多步骤表单或在表单中包含多步骤部分。附带可导入的独立CSS样式,可与我们的genesis
主题很好地配合使用。查看完整文档。@formkit/addons
中的新的浮动标签插件,为所有text
系列(text
、email
、url
等)和textarea
输入启用浮动标签。查看完整文档。Next
和Previous
字符串以供UI本地化对象使用。@formkit/themes
中缺少的Tailwind CSS genesis主题导出路径。:focus-visible
样式,以在使用键盘导航时显示焦点状态。submit
按钮添加缺失的loading
样式。此版本解决了beta.13
中针对Tailwind用户引入的一些问题。
@formkit/themes/tailwindcss
恢复为仅包含FormKitVariants
插件的default
导出。@formkit/themes/dist/tailwindcss/genesis
。!
更改为$remove:
,以避免与Tailwind内置的!
操作符冲突,该操作符将!important
添加到样式规则中。<FormKitMessages>
组件,允许重新定位表单的验证和错误消息,并允许group
和list
输入显示自己的错误和验证消息。!
前缀操作符有选择地删除现有类,而无需使用长格式对象语法。例如,outer-class="my-class !formkit-outer"
会添加my-class
并删除默认的formkit-outer
类。checkbox
和radio
输入现在在其各自的包装器周围添加了data-checked
属性,便于添加自定义样式以区分选中和未选中状态。en
、pt
、zh
)的验证消息。empty-message
属性,允许在未传递选项(dropdown
、autocomplete
和taglist
)时在列表框中呈现消息(#502)。dropdown
、autocomplete
和taglist
添加了checked
属性(#350)。taglist
和autocomplete
的multiple
输入添加了max
属性(#501)。closeOnSelect
属性,将保持listbox
在进行选择时展开(autocomplete
多选和taglist
)。forceExpanded
属性,用于开发目的,强制listbox
保持打开状态(dropdown
、autocomplete
和taglist
)。disabled
属性禁用。date_after
规则由于时区问题显示了错误的验证消息。#488v-model
的值现在可以初始化为undefined
。#235validation-rules
属性意外递归。#514sections-schema
覆盖。#541disabled
属性需要null
而不是false
来在外部包装器上渲染data-disabled
属性。#511<template v-slot>
块上使用v-if
)。#489sections-schema
的部分不能正确地遵守sections-schema
属性。taglist
的bug,重复的选项从API加载。#497multiple
属性设置为false
时,taglist
会渲染重复的props。#494autocomplete
的options
会重复。#431autocomplete
和taglist
的默认值。#505options
时,listbox
仍然可见。#504formkit.config.js
文件,将自动加载新的FormKit Tailwind Genesis主题。npx formkit create-app
命令,方便快速启动新的FormKit项目。length
规则验证消息。walkTree
函数上的stopIfFalse
参数。null
值初始化的选择输入没有一个好的值。#415count:blocking
事件在重复器中没有正确发出。[Object object]
#368。3.0.0-rc.8
和3.0.0-rc.9
一起使用 #371和#383。@formkit/themes/tailwindcss
#376。family
属性,该属性添加了一个data-family
属性,并在node.props.family
上设置值。这对于将插件和样式应用于整个输入“family”非常有用,例如文本输入的“family”,它将应用于text
,email
,password
,number
等。forceTypeProp
属性,它确保node.props.type
以给定值初始化,即使输入是在不同的名称下注册的。例如,myModifiedCheckbox
仍然可以报告“checkbox”作为node.props.type
。data-multiple
属性。type="form"
输入添加了新的@submit-invalid
事件。当用户尝试提交一个具有无效输入的表单时,触发此事件。@formkit/validation
中添加了新的getValidationMessages
辅助函数,用于提取节点及其验证消息的Map。decorator-icon
部分,可以轻松使用自定义SVG图标。context.state.dirty
都变为true的bug(#311)。node.reset()
时,空文件输入被设置为undefined而不是空数组的bug(#319)。removeFiles
部分已更名为fileRemove
。fileRemove
(以前是removeFiles
)部分以前呈现为<a>
标签,现在更改为button
。@formkit/inputs
中的组合函数已被“sections”替换。这只会影响那些从现有组合函数创建自己的输入的用户。@formkit/cli
命令行工具自由重组它们。通过添加、删除、更新或重新排序部分来修改现有输入,或者将您自己导出和修改的输入变体添加到输入库中。meta
属性(#248)。defaultConfig()
中的新theme
选项通过CDN安装FormKit CSS主题。submit
和setErrors
hooks。$formkit
简写语法时,key
属性无法工作的 bug(#232)。@blur
事件处理程序未被调用的 bug(#239)。for
循环迭代次数多 1 的 bug(#299)。input-errors
属性设置为空对象 {}
时,将重置之前设置的任何错误(#277)。alpha
和 alpha_spaces
规则中添加了对捷克/斯洛伐克变音符的支持(#281)。tailwindcss
、unocss
和 windicss
插件现在必须从 @formkit/themes
包的子路径中导入。例如:import formKitTailwindPlugin from '@formkit/themes/tailwindcss'
windicss
、tailwindcss
和 unocss
中删除了不正确的导入。update:model-value
事件现在只在使用 v-model
指令时触发。input
事件现在进行了防抖,以减少发出的噪音。您可以使用新的 input-raw
来监听每个输入事件。setErrors
设置的错误现在默认情况下会在输入时自动清除。要恢复到以前的行为,请在全局配置对象中设置 preserveErrors: true
。@formkit/tailwindcss
包现在已弃用 —— formKitTailwind
插件和 generateClasses
函数已移动到 @formkit/themes
包中。checkbox
、radio
和 select
输入(使用 :options
)现在可以使用任何数据类型作为其值,如数字、对象甚至 null
(#85)。node.clearErrors
和 clearErrors
实用程序,用于清除输入或表单中的后端错误。node.setErrors()
设置的任何错误。您可以使用 preserve-errors="true"
覆盖此默认行为(保留输入上的错误)。node.addProps
函数,用于在自定义插件中添加新的 props。message
。reset
—— 在表单重置后触发。index
属性,允许在父级 list
类型中的给定索引处注入输入。<FormKit>
组件的 input
事件现在进行了防抖,这意味着它发出的噪音要少得多。import { features } from '@formkit/inputs'
。<FormKit>
组件添加了一个新的 input-raw
事件,它会在输入、列表、组或表单中的每个单个输入事件中触发(非常嘈杂)。input
、input-raw
、submit
和 submit-raw
事件的第二个参数。dom-input-event
,其负载为原生 HTML Event
对象。@formkit/themes
现在包括了针对 Tailwind CSS (formKitTailwind
)、Windi CSS (formKitWindi
) 和 Uno CSS (formKitUno
) 的插件函数的命名导出。通过将正确的插件添加到 CSS 框架的配置文件中,您将可以访问各种 formkit 变体,如 formkit-invalid:
和 formkit-disabled:
。@formkit/themes
现在包括了 generateClasses
辅助函数,它允许您根据输入类型轻松提供不同的类列表给 ${sectionKey}
。v-model
的性能和可靠性,特别是对于深层嵌套结构,如带有列表和组的表单。null
值引发错误的问题(#151)。validation-visibility
未更改的 bug(#159)。preserve
关键字阻止某些表单提交的 bug(#145)。@formkit/tailwind
配置的 TypeScript 类型错误(#143)。on-value
的单个复选框在使用 :value
属性时无法设置其初始值的 bug。multiple="false"
属性和占位符的选择列表上导致错误的默认选择的 bug(#148)。classes
prop 无法对 Vue 的响应性作出反应的 bug(#155)。disabled="true"
的情况下,通过在表单上使用 disabled
属性应用禁用的提交按钮的 bug(#215)。alpha_spaces
验证规则 (#83)node.input()
设置单选框输入时导致反应性丢失的 bug (#139)@submit
事件的 TypeScript 注释 (#130)data-loading
属性已从表单的提交按钮移动到 <form>
标签本身。@formkit/tailwindcss
插件,可以轻松创建适用于 FormKit 表单的 Tailwind 主题。查看创建 Tailwind CSS 主题指南了解更多详情。reset
函数。可以在任何输入、组、表单或列表上执行此操作,它将将值恢复到初始状态。它还会重置 context.state
对象(如 blurred
和 dirty
)。aria-describedby
和 aria-live
来改进可访问性。aria-describedby
现在会定位到帮助文本、验证消息和错误消息(由使用 for
属性的 <label>
标签提供标签)。undefined
值应用于其子元素。换句话说,如果一个表单是 v-modeled,并且其值设置为空对象 {}
,它将清除整个表单。context.state.settled
属性,表示输入的内部去抖动周期已结束,并且值已完成提交到表单。data-submitted
属性。fileName
部分键(感谢 @santi)。parent
属性,用于高级用例,其中输入与其表单或数据结构解耦。input-class
)不正确地遵循 $reset
命令的 bug,因为它被视为变量 (#61)。file-list-class
或 file-item-class
(#120)。import '@formkit/themes/genesis
导入。node.submit()
提交(包括表单的任何子节点)。this.$formkit.submit('form-id')
提交(对于组合 API,使用 submitForm('form-id')
)。setErrors
的开发体验:node.setErrors(nodeErrors, childErrors)
。setErrors
现在支持纯字符串 node.setErrors('My error')
。<FormKit>
组件的核心节点现在可以通过模板引用访问。outer
部分添加 data-invalid
属性(示例)。setErrors
)时,在 outer
部分添加 data-errors
属性。outer
部分添加 data-complete
属性(示例):context.state
属性:state.rules
- 当输入具有验证规则时为 true。state.errors
- 当输入上有显式错误时为 true。state.complete
- 与 data-complete
的逻辑相同。state.validationVisible
- 当满足 validation-visibility
条件时为 true(如果有验证错误,则显示验证错误)。node.setErrors
的文档。context.state
的文档。file
输入触发自定义 onChange
事件的 bug(#90)。id
输出到 DOM 的 bug。:value
属性在输入时被改变的 bug(#72)。prop:{propName}
事件的不一致性(#73)。beta.3
本来是一个很棒的版本,但我们决定跳过它,直接进入 beta.4
👀!开个玩笑。我们在使用 npm 时遇到了问题,不得不升级 🤦。@formkit/nuxt
包是一个完整的Nuxt 3 模块,使得在 Nuxt 3 中使用 FormKit 变得尽可能简单!defaultConfig
现在包含一个新的包 @formkit/dev
,它将 FormKit 的错误代码解码为有用的控制台消息(无需操作)(#56)。preserve
键现在适用于所有后代元素(#53)。@formkit/i18n
包中导出所有文本格式化函数(#54)。@formkit
组织安装!options
属性时,多选复选框无法显示当前值的 bug(#55)。submit-behavior
属性,用于取消新的自动禁用表单功能。@formkit/vue
包中将 Vue 到 FormKit 绑定插件导出为 bindings
。button
和 submit
的输入。defaultConfig
中引入了一个新的 messages
键,允许对区域设置进行部分覆盖。这允许对已注册的区域设置进行选择性消息覆盖(#42)。$: undefined
将输出值 undefined
而不是字符串 "undefined")。group
、list
或 form
重新填充时,具有 options
的复选框无法正确填充的问题(#45)。options
的复选框显示不正确的问题(#41)。<FormKit>
组件上的 validation-behavior
属性更改为 validation-visibility
。<FormKit>
组件上的 schema
属性更改为 sections-schema
。file
输入类型,支持一些增值功能:createInput
辅助函数,使得编写自定义输入变得容易。incomplete-message
属性允许内联自定义(或禁用)表单在尝试提交且所有输入都无效时显示的消息。defaultConfig
,以接受自定义输入。__raw__
前缀来传递原始值而不是解析后的结果的 props
和 attrs
属性(#36)。plugin.library
的文档 - 插件用于定义新的输入类型的机制。.vue
,.js
,formkit.config.js
和tailwind.config.js
文件。@submit
和@submit-raw
事件的TypeScript类型定义。length
和between
验证消息中数字顺序的问题,始终将较小的数字放在前面(#35)。:options
属性不接受数字值。v-if
),现在会从表单数据中删除其值并取消注册其核心节点。preserve
属性允许输入在被移除时不从组、列表和表单中删除其数据。placeholder
在options
属性之后时无法呈现的错误。input-errors
属性或$formkit.setErrors()
方法在整个表单、组或列表上设置输入错误。在表单文档中了解更多。$formkit.setLocale()
可以动态更改所有显示消息的语言。rootConfig
代理对象,用于存储全局基本配置和属性值(配置系统的重大重构)。FormKitObservedNode
实例中添加了账本依赖跟踪。child
节点事件。length
规则现在可以按任意顺序接受最大/最小参数,例如length:15,5
或length:5,15
都会得到相同的结果。getNode
函数,用于直接访问FormKit节点使用组合API。@formkit/theme
CSS 导入位置。list
输入的子项有时在显示验证错误时抛出异常的问题。node.input()
调用在Vue中触发响应性。$formkit
模式简写,用于在模式中使用FormKit输入(Issue #15)。disabled
属性自动禁用所有子输入(Issue #16)。submitAttrs
属性允许您将属性传递给表单的提交按钮。ignore
属性,防止使用输入数据。