mirror of https://github.com/ElemeFE/element
Select: fix minor bugs
parent
2d07391d3c
commit
3ee74b296e
|
@ -91,7 +91,7 @@
|
||||||
value: 'Guangzhou',
|
value: 'Guangzhou',
|
||||||
label: '广州'
|
label: '广州'
|
||||||
}],
|
}],
|
||||||
value: '选项2',
|
value: '',
|
||||||
value2: '',
|
value2: '',
|
||||||
value3: '',
|
value3: '',
|
||||||
value4: '',
|
value4: '',
|
||||||
|
@ -108,20 +108,9 @@
|
||||||
|
|
||||||
mounted() {
|
mounted() {
|
||||||
this.list = this.states.map(item => { return { value: item, label: item }; });
|
this.list = this.states.map(item => { return { value: item, label: item }; });
|
||||||
// this.options4 = this.states.map(item => { return { value: item, label: item }; });
|
|
||||||
// this.value9 = ['Vermont'];
|
|
||||||
},
|
},
|
||||||
|
|
||||||
methods: {
|
methods: {
|
||||||
empty() {
|
|
||||||
this.value9 = ['New York'];
|
|
||||||
},
|
|
||||||
aa(val) {
|
|
||||||
console.log('change', val)
|
|
||||||
},
|
|
||||||
bb() {
|
|
||||||
this.options.splice(0, 1, { label: 'haha', value: 'haha' });
|
|
||||||
},
|
|
||||||
remoteMethod(query) {
|
remoteMethod(query) {
|
||||||
if (query !== '') {
|
if (query !== '') {
|
||||||
this.loading = true;
|
this.loading = true;
|
||||||
|
@ -151,11 +140,10 @@
|
||||||
### 基础用法
|
### 基础用法
|
||||||
|
|
||||||
适用广泛的基础单选
|
适用广泛的基础单选
|
||||||
<el-button @click="bb">bb</el-button>
|
|
||||||
:::demo `v-model`的值为当前被选中的`el-option`的 value 属性值
|
:::demo `v-model`的值为当前被选中的`el-option`的 value 属性值
|
||||||
```html
|
```html
|
||||||
<template>
|
<template>
|
||||||
<el-select v-model="value" placeholder="请选择" @change="aa">
|
<el-select v-model="value" placeholder="请选择">
|
||||||
<el-option
|
<el-option
|
||||||
v-for="item in options"
|
v-for="item in options"
|
||||||
:label="item.label"
|
:label="item.label"
|
||||||
|
@ -521,7 +509,6 @@
|
||||||
### 远程搜索
|
### 远程搜索
|
||||||
|
|
||||||
从服务器搜索数据,输入关键字进行查找
|
从服务器搜索数据,输入关键字进行查找
|
||||||
<el-button @click="empty">aa</el-button>
|
|
||||||
:::demo 为了启用远程搜索,需要将`filterable`和`remote`设置为`true`,同时传入一个`remote-method`。`remote-method`为一个`Function`,它会在输入值发生变化时调用,参数为当前输入值。需要注意的是,如果`el-option`是通过`v-for`指令渲染出来的,此时需要为`el-option`添加`key`属性,且其值需具有唯一性,比如此例中的`item.value`。
|
:::demo 为了启用远程搜索,需要将`filterable`和`remote`设置为`true`,同时传入一个`remote-method`。`remote-method`为一个`Function`,它会在输入值发生变化时调用,参数为当前输入值。需要注意的是,如果`el-option`是通过`v-for`指令渲染出来的,此时需要为`el-option`添加`key`属性,且其值需具有唯一性,比如此例中的`item.value`。
|
||||||
```html
|
```html
|
||||||
<template>
|
<template>
|
||||||
|
@ -529,7 +516,6 @@
|
||||||
v-model="value9"
|
v-model="value9"
|
||||||
multiple
|
multiple
|
||||||
filterable
|
filterable
|
||||||
allow-create
|
|
||||||
remote
|
remote
|
||||||
placeholder="请输入关键词"
|
placeholder="请输入关键词"
|
||||||
:remote-method="remoteMethod"
|
:remote-method="remoteMethod"
|
||||||
|
|
|
@ -257,6 +257,7 @@
|
||||||
this.$refs.input.blur();
|
this.$refs.input.blur();
|
||||||
}
|
}
|
||||||
this.query = '';
|
this.query = '';
|
||||||
|
this.selectedLabel = '';
|
||||||
this.resetHoverIndex();
|
this.resetHoverIndex();
|
||||||
if (!this.multiple) {
|
if (!this.multiple) {
|
||||||
this.getOverflows();
|
this.getOverflows();
|
||||||
|
@ -287,8 +288,6 @@
|
||||||
|
|
||||||
options(val) {
|
options(val) {
|
||||||
this.optionsAllDisabled = val.length === val.filter(item => item.disabled === true).length;
|
this.optionsAllDisabled = val.length === val.filter(item => item.disabled === true).length;
|
||||||
// 下面这行先去掉,因为 remote !multiple 时会有问题
|
|
||||||
// this.selected = this.getSelected();
|
|
||||||
if (this.multiple) {
|
if (this.multiple) {
|
||||||
this.resetInputHeight();
|
this.resetInputHeight();
|
||||||
}
|
}
|
||||||
|
@ -577,6 +576,9 @@
|
||||||
},
|
},
|
||||||
|
|
||||||
mounted() {
|
mounted() {
|
||||||
|
if (this.multiple && Array.isArray(this.value) && this.value.length > 0) {
|
||||||
|
this.currentPlaceholder = '';
|
||||||
|
}
|
||||||
addResizeListener(this.$el, this.resetInputWidth);
|
addResizeListener(this.$el, this.resetInputWidth);
|
||||||
this.selected = this.getSelected();
|
this.selected = this.getSelected();
|
||||||
if (this.remote && this.multiple) {
|
if (this.remote && this.multiple) {
|
||||||
|
|
Loading…
Reference in New Issue