This commit is contained in:
梁灏 2017-04-05 15:44:05 +08:00
parent 7409cb3c27
commit 15b72d31b0
2 changed files with 43 additions and 226 deletions

View file

@ -1,206 +1,16 @@
<!--<template>-->
<!--<div>-->
<!--<i-select v-model="model1" style="width:200px" clearable>-->
<!--<i-option v-for="item in cityList" :value="item.value">{{ item.label }}</i-option>-->
<!--</i-select>-->
<!--{{ model1 }}-->
<!--<div @click="c">change</div>-->
<!--</div>-->
<!--</template>-->
<!--<script>-->
<!--export default {-->
<!--data () {-->
<!--return {-->
<!--cityList: [-->
<!--{-->
<!--value: 'beijing',-->
<!--label: '北京市'-->
<!--},-->
<!--{-->
<!--value: 'shanghai',-->
<!--label: '上海市'-->
<!--},-->
<!--{-->
<!--value: 'shenzhen',-->
<!--label: '深圳市'-->
<!--},-->
<!--{-->
<!--value: 'hangzhou',-->
<!--label: '杭州市'-->
<!--},-->
<!--{-->
<!--value: 'nanjing',-->
<!--label: '南京市'-->
<!--},-->
<!--{-->
<!--value: 'chongqing',-->
<!--label: '重庆市'-->
<!--}-->
<!--],-->
<!--model1: ''-->
<!--}-->
<!--},-->
<!--methods: {-->
<!--c () {-->
<!--this.model1 = 'hangzhou'-->
<!--}-->
<!--}-->
<!--}-->
<!--</script>-->
<!--<template>-->
<!--<div>-->
<!--<i-select v-model="model5" disabled style="width:200px">-->
<!--<i-option v-for="item in cityList" :value="item.value">{{ item.label }}</i-option>-->
<!--</i-select>-->
<!--<i-select v-model="model6" style="width:200px">-->
<!--<i-option value="beijing">北京市</i-option>-->
<!--<i-option value="shanghai" disabled>上海市</i-option>-->
<!--<i-option value="shenzhen">深圳市</i-option>-->
<!--</i-select>-->
<!--</div>-->
<!--</template>-->
<!--<script>-->
<!--export default {-->
<!--data () {-->
<!--return {-->
<!--cityList: [-->
<!--{-->
<!--value: 'beijing',-->
<!--label: '北京市'-->
<!--},-->
<!--{-->
<!--value: 'shanghai',-->
<!--label: '上海市'-->
<!--},-->
<!--{-->
<!--value: 'shenzhen',-->
<!--label: '深圳市'-->
<!--},-->
<!--{-->
<!--value: 'hangzhou',-->
<!--label: '杭州市'-->
<!--},-->
<!--{-->
<!--value: 'nanjing',-->
<!--label: '南京市'-->
<!--},-->
<!--{-->
<!--value: 'chongqing',-->
<!--label: '重庆市'-->
<!--}-->
<!--],-->
<!--model5: '',-->
<!--model6: ''-->
<!--}-->
<!--}-->
<!--}-->
<!--</script>-->
<!--<template>-->
<!--<div>-->
<!--<i-select v-model="model7" style="width:200px">-->
<!--<Option-group label="热门城市">-->
<!--<i-option v-for="item in cityList" :value="item.value">{{ item.label }}</i-option>-->
<!--</Option-group>-->
<!--<Option-group label="其它城市">-->
<!--<i-option v-for="item in cityList" :value="item.value">{{ item.label }}</i-option>-->
<!--</Option-group>-->
<!--</i-select>-->
<!--</div>-->
<!--</template>-->
<!--<script>-->
<!--export default {-->
<!--data () {-->
<!--return {-->
<!--cityList: [-->
<!--{-->
<!--value: 'beijing',-->
<!--label: '北京市'-->
<!--},-->
<!--{-->
<!--value: 'shanghai',-->
<!--label: '上海市'-->
<!--},-->
<!--{-->
<!--value: 'shenzhen',-->
<!--label: '深圳市'-->
<!--},-->
<!--{-->
<!--value: 'hangzhou',-->
<!--label: '杭州市'-->
<!--},-->
<!--{-->
<!--value: 'nanjing',-->
<!--label: '南京市'-->
<!--},-->
<!--{-->
<!--value: 'chongqing',-->
<!--label: '重庆市'-->
<!--}-->
<!--],-->
<!--model7: ''-->
<!--}-->
<!--}-->
<!--}-->
<!--</script>-->
<!--<template>-->
<!--<div>-->
<!--<i-select v-model="model10" multiple style="width:260px">-->
<!--<i-option v-for="item in cityList" :value="item.value">{{ item.label }}</i-option>-->
<!--</i-select>-->
<!--</div>-->
<!--</template>-->
<!--<script>-->
<!--export default {-->
<!--data () {-->
<!--return {-->
<!--cityList: [-->
<!--{-->
<!--value: 'beijing',-->
<!--label: '北京市'-->
<!--},-->
<!--{-->
<!--value: 'shanghai',-->
<!--label: '上海市'-->
<!--},-->
<!--{-->
<!--value: 'shenzhen',-->
<!--label: '深圳市'-->
<!--},-->
<!--{-->
<!--value: 'hangzhou',-->
<!--label: '杭州市'-->
<!--},-->
<!--{-->
<!--value: 'nanjing',-->
<!--label: '南京市'-->
<!--},-->
<!--{-->
<!--value: 'chongqing',-->
<!--label: '重庆市'-->
<!--}-->
<!--],-->
<!--model10: []-->
<!--}-->
<!--}-->
<!--}-->
<!--</script>-->
<template>
<div style="margin: 1000px 0 0 ">
<Select v-model="model1" style="width:200px">
<Row>
<i-col span="12" style="padding-right:10px">
<Select v-model="model11" filterable>
<Option v-for="item in cityList" :value="item.value" :key="item">{{ item.label }}</Option>
</Select>
{{ model1 }}
<Button @click="set">set</Button>
<Button @click="add">add</Button>
<Button @click="remove">remove</Button>
</div>
</i-col>
<i-col span="12">
<Select v-model="model12" filterable multiple>
<Option v-for="item in cityList" :value="item.value" :key="item">{{ item.label }}</Option>
</Select>
</i-col>
</Row>
</template>
<script>
export default {
@ -218,26 +28,22 @@
{
value: 'shenzhen',
label: '深圳市'
},
{
value: 'hangzhou',
label: '杭州市'
},
{
value: 'nanjing',
label: '南京市'
},
{
value: 'chongqing',
label: '重庆市'
}
],
model1: ''
}
},
methods: {
clear(){
this.d = [];
},
set () {
this.model1 = 'shenzhen';
},
add () {
this.cityList.push({
value: 'chongqing',
label: '重庆市'
});
},
remove () {
this.cityList.splice(0, 1);
model11: '',
model12: []
}
}
}

View file

@ -506,6 +506,14 @@
}
});
}
},
broadcastQuery (val) {
if (findComponentDownward(this, 'OptionGroup')) {
this.broadcast('OptionGroup', 'on-query-change', val);
this.broadcast('iOption', 'on-query-change', val);
} else {
this.broadcast('iOption', 'on-query-change', val);
}
}
},
mounted () {
@ -579,13 +587,21 @@
},
visible (val) {
if (val) {
if (this.multiple && this.filterable) {
this.$refs.input.focus();
if (this.filterable) {
if (this.multiple) {
this.$refs.input.focus();
} else {
this.$refs.input.select();
}
}
this.broadcast('Drop', 'on-update-popper');
} else {
if (this.filterable) {
this.$refs.input.blur();
// #566 reset options visible
setTimeout(() => {
this.broadcastQuery('');
}, 300);
}
this.broadcast('Drop', 'on-destroy-popper');
}
@ -593,12 +609,7 @@
query (val) {
this.$emit('on-query-change', val);
if (findComponentDownward(this, 'OptionGroup')) {
this.broadcast('OptionGroup', 'on-query-change', val);
this.broadcast('iOption', 'on-query-change', val);
} else {
this.broadcast('iOption', 'on-query-change', val);
}
this.broadcastQuery(val);
let is_hidden = true;