组件配置项

配置示例如下，配置后效果如图2所示，组件配置项详细介绍请参见表1。

{
    migrateFrom: "advancedSettings",
    headerTitle: { zh_CN: "下拉选择框设置", en_US: "Setting the select box" },
    belong: "configuration",
    config: [
        {
            type: "text",
            name: "defaultSelectValue",
            parentName: "selectConfObj",
            value: "请选择",
            label: { zh_CN: "默认选择项", en_US: "Default selection" },
        },
        {
            type: "select",
            name: "fontFamily",
            parentName: "selectConfObj",
            label: { zh_CN: "字体", en_US: "Font" },
            value: "sans-serif",
            noClearable: true,
            options: [
                {
                    label: "sans-serif",
                    value: "sans-serif",
                    selected: "true",
                },
            ],
            showFunc: function () {
                return false;
            },
        },
        {
            type: "select",
            name: "fontWeight",
            parentName: "selectConfObj",
            value: "normal",
            label: { zh_CN: "字体粗细", en_US: "Font Weight" },
            noClearable: true,
            options: [
                {
                    label: { zh_CN: "正常", en_US: "Normal" },
                    value: "normal",
                },
                {
                    label: { zh_CN: "粗体", en_US: "Bold" },
                    value: "bold",
                },
                {
                    label: { zh_CN: "细体", en_US: "Lighter" },
                    value: "lighter",
                },
            ],
            showFunc: function () {
                return false;
            },
        },
        {
            type: "slider",
            name: "fontSize",
            parentName: "selectConfObj",
            label: { zh_CN: "字体大小", en_US: "Font Size" },
            value: 12,
            min: 0,
            max: 200,
            showInput: true,
            showFunc: function () {
                return false;
            },
        },
        {
            type: "colorpicker",
            name: "fontColor",
            parentName: "selectConfObj",
            label: { zh_CN: "字体颜色", en_US: "Font Color" },
            value: "",
            showFunc: function () {
                return false;
            },
        },
        {
            type: "font",
            subType: "notChart",
            prop: "commProps",
            parentName: "commProps",
            label: { zh_CN: "字体", en_US: "Font" },
            fontFamilyKey: "fontFamily",
            fontWeightKey: "fontWeight",
            fontSizeKey: "fontSize",
            fontColorKey: "fontColor",
        },
        {
            type: "colorpicker",
            name: "backgroundColor",
            parentName: "selectConfObj",
            label: { zh_CN: "背景颜色", en_US: "Background Color" },
            value: "",
        },
        {
            type: "colorpicker",
            name: "borderColor",
            parentName: "selectConfObj",
            label: { zh_CN: "边框颜色", en_US: "Border Color" },
            value: "",
        },
        {
            type: "colorpicker",
            name: "borderColorFocus",
            parentName: "selectConfObj",
            label: { zh_CN: "边框聚焦颜色", en_US: "Border Focus Color" },
            value: "",
        },
        {
            type: "colorpicker",
            name: "borderColorHover",
            parentName: "selectConfObj",
            label: { zh_CN: "边框悬浮颜色", en_US: "Border floating Color" },
            value: "",
        },
        {
            type: "text",
            name: "placeholder",
            parentName: "selectConfObj",
            label: { zh_CN: "占位符", en_US: "Placeholder" },
            value: "请选择",
        },
        {
            type: "tab",
            name: "disabled",
            parentName: "selectConfObj",
            label: { zh_CN: "是否禁用", en_US: "Disable" },
            value: false,
            options: [
                {
                    label: { zh_CN: "禁用", en_US: "Disable" },
                    value: true,
                },
                {
                    label: { zh_CN: "可用", en_US: "Available" },
                    value: false,
                },
            ],
        },
    ],
}

图2 设置后效果