更新时间:2025-12-30 GMT+08:00
分享

内置配置器组件参考

配置器组件是UI引擎为自定义组件属性提供的可视化编辑控件,开发者可通过在物料协议中指定配置器类型及属性,实现自定义组件属性的灵活配置。以下为UI引擎内置配置器组件的详细说明:

表1 配置器组件参考说明

组件名称

说明

属性列表

参考图

MetaInput

基础文本输入配置器,适用于字符串类型属性编辑。

  • rows:数值类型,指定显示的行数(适用于多行输入)。
  • placeholder:字符串类型,设置输入框的提示文本。

CustomInputConfigurator

增强型文本输入配置器,支持失焦时自动回填默认值。

  • rows:数值类型,指定显示的行数(适用于多行输入)。
  • placeholder:字符串类型,设置输入框的提示文本。
  • maxlength:数值型,限制输入的最大长度。
  • showWordLimit:布尔型,是否显示字符数统计。

MetaSwitch

开关样式的配置器,专用于布尔(true/false)类型属性编辑。

无。

MetaSelect

下拉选择配置器,适用于枚举类型属性编辑。

  • clearable:布尔类型,是否支持清空选中值。
  • options:对象数组,下拉选项列表,每个对象需包含label(显示文本)和value(实际取值)。

NumConfigurator

数字输入配置器,支持整数/浮点数的精细化输入控制。

  • controls:布尔类型,是否显示加减调节按钮,默认值为true。
  • max:数值类型,输入最大值。
  • min:数值类型,输入最小值。
  • step:数值类型,加减调节步长。
  • stepStrictly:布尔类型,是否仅允许输入step的倍数值。如果为true,用户输入非倍数值时会自动取最近的倍数值。例如:步长5,输入17自动转为15,输入18自动转为20。

CodeConfigurator

代码编辑配置器,适用于对象、数组等复杂结构属性,或自定义代码片段编辑。

  • language:字符串类型,代码语言,默认json。
  • dataType:枚举值,取值范围为“JSFunction”“JSExpression”。当值为“JSExpression”时等效于状态绑定。

    注意:dataType和language不可同时使用。

  • tips:对象类型,用于配置示例代码和左侧面板的标题。
    • title:字符串,左侧面板的标题。
    • demo:字符串,示例代码内容。

ButtonGroupConfigurator

按钮组选择配置器,适用于2-3个枚举值的快捷选择场景。

options:对象数组,定义按钮组的选项列表。每个对象需包含以下两个属性:

  • label:字符串类型,按钮的显示文本。
  • value:任意类型,按钮的实际取值。

IconSelectConfigurator

图标选择配置器,可选图标范围为TinyVue内置图标集。

注意:此配置器仅返回图标名称字符串,需在自定义组件内自行实现图标渲染逻辑。

无。

SliderConfigurator

滑动输入配置器,用于快速设置0-100范围内的数值属性。

controls:布尔型,默认为true,是否显示右侧的加减按钮。

ArrayItemConfigurator

对象数组配置器,专用于表格列配置、二级面板配置等复杂数组场景。

expand:布尔类型,是否支持展开二级配置面板。

开启后,需同步配置二级面板的属性项。

相关文档