SOURCE

console 命令行工具 X clear

                    
>
console
var Main = {
  data () {
        return {
            val1: null,
            options: [
                { label: '1~', value: 1, items: {a: 1} },
                { label: '2~', value: 2, items: {a: 2} },
                { label: '3~', value: 3, items: {a: 3} },
                { label: '4~', value: 4, items: {a: 4} },
                { label: '5~', value: 5, items: {a: 5} },
                { label: '6~', value: 6, items: {a: 6} },
                { label: '7~', value: 7, items: {a: 7} },
            ]
        }
    },
    methods: {
        selectChange({ value, $event }) {
            const { a } = value;
            this.val1 = a;
        }
    }
};
var app = new Vue(Main).$mount('#app')
<script src="https://unpkg.com/vue@2.6.14"></script>
<script src="https://unpkg.com/xe-utils"></script>
<script src="https://unpkg.com/vxe-pc-ui@3.5.29"></script>
<script src="https://unpkg.com/vxe-table@3.15.8"></script>

<div id="app">
	 <vxe-select v-model="val1" placeholder="可新增" 
        clearable filterable @change="selectChange"
        :option-props="{ value: 'items' }"
        :options="options">
        <template #option="{option}">
            <span>{{ option.label }} </span>
            <span>---</span>
            <span>{{ option.value }} </span>
            <span>---</span>
            <span>{{ option.items.a }} </span>
        </template>
    </vxe-select>
</div>
@import url("https://unpkg.com/vxe-pc-ui@3.5.29/lib/style.css");
@import url("https://unpkg.com/vxe-table@3.15.8/lib/style.css");

本项目引用的自定义外部资源