list

配置项说明

表1 list配置项说明
参数	类型	是否必选	示例	说明
type	String	是	type: "list"	配置项类型。
name	String	是	name:"intervalColors"	双向绑定list名称。
label	Object	否	label: { "zh_CN": "中文标签", "en_US": "English Label" }	配置项的标签，需要国际化。
listFixed	Boolean	否	listFixed: true	列表个数固定，不展示新增、删除功能，默认为true展示。
labelOnce	Boolean	否	labelOnce: true	仅在list首项展示一次label。设置为true时，只有list中第一项展示list label。设置为false时，每一项都展示label。
showIndex	Boolean	否	showIndex: true	label末尾显示计数。设置为true时，label末尾进行计数(index+1)展示为label1，label2…。设置false时，每一个label内容相同。
displayMode	String	否	displayMode: “box”displayMode: “simple”	显示为下拉框中或平铺。 box：显示在下拉框中。 simple：直接显示。
events	Object	是	events: { addItemFunc: function (vm, index) { return { size: 1, color: 'rgba(11,129,246,1)'} }, itemDelCallBack: function (values) { if (values && values.length) { values[values.length - 1].size = 1; } }, },	增加和删除list中一项。默认有增加删除功能，所以需要添加addItemFunc和itemDelCallBack函数。如果noAdd为true，不需要添加。
childItems	Array	是	childItems: [ { type: "colorpicker", name: "color", value: "rgba(11,129,246,1)", width: 26, showInput: false, }, { type: "input-number", name: "number", prop: "number", label: "序列号" originFrom: "advanceEditvm", value: "123", width: 74, labelWidth: 20, }]	list中每一项含有的基础配置项。基础配置项中可以通过加入width调整一行中的占比，例如3个options的width是20,30,30，三个配置项就会出现在一行。如果width是20,30,70，前两个会在一行，第三个占第二行的70%。如果不加入width或者width占比为100，就会单独占一行。基础配置项中也增加了labelWidth，在有label的情况下可以通过输入数字控制label的宽度（单位为px）。
tip	Object	否	tip: { zh_CN: "当前排行榜展示的数据行数", en_US: "Number of data rows displayed in the current ranking page.", }	label后会显示info提示。
allowNone	Boolean	否	allowNone: true,	是否允许删除到空。默认为false，不允许删除到空。
helpLink	String	否	helpLink: "http://..."	使用helpIcon。

事件

表2 事件
事件名称	调用配置项中的方法	说明	回调参数
change	change	值改变时触发	(value, data, field)
addItemFunc	addAssembleType	单击新增时触发	(vm)
itemDelCallBack	delAssembleType	单击删除时触发	(value)

配置示例

配置后效果，如图1所示。

{
    type: "list",
    name: "commProps.rowCusBg",
    displayMode: "simple",
    labelOnce: true,
    allowNone: true,
    label: { zh_CN: "背景色", en_US: "Background Color" },
    helpLink:
    "https://***.html",
    childItems: [
        {
            type: "colorpicker",
            name: "color",
            originFrom: "advanceEditvm",
            value: "",
            width: 26,
            showInput: false,
        },
        {
            type: "string",
            name: "row",
            originFrom: "advanceEditvm",
            label: { zh_CN: "序列号", en_US: "Serial Number" },
            value: "",
            width: 74,
        },
    ],
},

图1 配置后效果