Browse Source

select增加数据转换类型、增加示例

pull/93/head
zq 1 day ago
parent
commit
50d55e7086
  1. 7
      src/components/GuipSelect.vue
  2. 7
      src/views/elementGroups.vue

7
src/components/GuipSelect.vue

@ -61,6 +61,13 @@ export default {
processedOptions() {
// options
let options = this.options || [];
// [1,12,22]
if (Array.isArray(options) && options.every(item => typeof item !== 'object')) {
return options.map((item, index) => ({
[this.valueKey]: index,
[this.labelKey]: item
}));
}
//
if (options && !Array.isArray(options)) {

7
src/views/elementGroups.vue

@ -75,12 +75,17 @@
value-key="id" />
</div>
<div class="ele-item">
<label for="">普通数组类型下拉框</label>
<label for="">数组套对象类型下拉框</label>
<!-- :extraItem="{label:'全部',value:'99999'}" 传入必须是 labelvalue 组件内会自动改为自定义的 labelKeyvalueKey-->
<GuipSelect width="150px" v-model="form.card" clearable label="卡片" :default-value="form.card" @change="selectChangeTest"
prop="card" :options="options" valueKey="id1" labelKey="id2" :extraItem="{label:'全部',value:'99999'}"/>
</div>
<div class="ele-item">
<label for="">纯数组[1,2]下拉框</label>
<GuipSelect width="150px" v-model="form.card" clearable label="卡片" @change="selectChangeTest"
prop="card" :options="['麻辣烫','提拉米苏']" />
</div>
<div class="ele-item">
<label for="">对象格式下拉框</label>
<GuipSelect width="150px" v-model="form.card1" clearable label="卡片" :default-value="form.card" @change="selectChangeTest"
prop="card" :options="languageOptions"/>

Loading…
Cancel
Save