Skip to content

DynamicInput 动态录入

规则

基础示例(input 预设,多行字符串)

Props 配置示例

pair 预设(键值对)

排序、禁用与样式

整段禁用

Events 事件示例

完整配置项请参考: naive-ui_DynamicInput

value(表单)

  • preset'input'(默认)时:推荐 Array<string>,与 Input 预设一致。
  • preset'pair' 时:推荐 Array<{ key: string, value: string }>

DynamicInput Props

名称类型默认值说明
createButtonPropsButtonPropsundefined新建项按钮的属性(2.25.0+)
defaultValueunknown[][]非受控模式下的默认值
disabledbooleanfalse是否禁用(对自定义内容无效,2.34.4+)
itemClassstringundefined每项的类名(2.36.0+)
itemStylestring | objectundefined每项的样式
keyFieldstringundefined每一项的 key,用于列表渲染
minnumber0最少项数
maxnumberundefined最多项数
preset'input' | 'pair''input'内置预设;未设置默认插槽时生效
showSortButtonbooleanfalse是否显示排序按钮(2.25.0+)
valueunknown[]undefined受控模式下的值
onCreate(index: number) => void | unknownundefined点击添加时回调;若返回值则作为新项初始值(index 从 1 起表示插入位置语义,见 Naive 文档)
onRemove(index: number) => voidundefined删除第 index 项时回调
onUpdateValue(value: any) => voidundefined值变化回调

DynamicInput Props(Input 预设)

名称类型默认值说明
valueArray<string>(受控由表单同步)Input 预设下的值
placeholderstring''每项输入框占位

DynamicInput Props(Pair 预设)

名称类型默认值说明
valueArray<{ key: string, value: string }>(受控由表单同步)Pair 预设下的值
keyPlaceholderstring''key 输入框占位
valuePlaceholderstring''value 输入框占位

FormCreate 是一个开源项目,基于 MIT 许可证发布,欢迎个人和企业用户免费使用