Skip to content

组件的前缀和后缀 ​

在使用 FormCreate 生成表单时,可以通过生成规则中的 prefix 和 suffix 属性为组件添加前缀和后缀。这些属性允许在组件的输入框或选择框之前或之后添加内容,如图标、文本或自定义的 HTML 元素,以增强用户体验。

注意

自定义前缀后缀不支持表单组件

前后缀的显示位置因组件类型而异:行内组件后缀显示在尾部,块级组件后缀会自动换行显示。

类型 ​

  • prefix: string|VNodeData 设置组件的前缀内容,可以是字符串或者 VNode 数据对象。
  • suffix: string|VNodeData 设置组件的后缀内容,同样可以是字符串或者 VNode 数据对象。

示例 ​

文字描述 ​

为输入框和日期选择器组件设置前缀和后缀内容,通过在组件规则中配置prefix和suffix属性。

自定义组件 ​

使用自定义组件作为表单字段的前缀和后缀:通过配置包含类型、子元素和属性的对象,为输入框和日期选择器添加带有加载状态的按钮组件。

为输入框添加前缀和后缀图标 ​

在这个示例中,我们为输入框组件添加了一个货币符号作为前缀,并添加了一个单位作为后缀。

使用自定义 HTML 元素作为前缀和后缀 ​

你可以使用自定义的 HTML 元素或组件作为前缀和后缀。

通过使用 prefix 和 suffix 属性,您可以为表单组件添加丰富的视觉元素,提供更好的用户体验。这些属性的灵活性允许您根据具体的业务需求进行定制,从而实现复杂的表单设计。

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