diff --git a/examples/play/index.vue b/examples/play/index.vue index 2370097d6..9d8e0f59e 100644 --- a/examples/play/index.vue +++ b/examples/play/index.vue @@ -1,6 +1,14 @@ @@ -8,7 +16,24 @@ export default { data() { return { - input: 'Hello Element UI!' + options: [{ + value: '选项1', + label: '黄金糕' + }, { + value: '选项2', + label: '双皮奶', + disabled: true + }, { + value: '选项3', + label: '蚵仔煎' + }, { + value: '选项4', + label: '龙须面' + }, { + value: '选项5', + label: '北京烤鸭' + }], + value1: ['选项2'], }; } }; diff --git a/packages/select/src/select.vue b/packages/select/src/select.vue index 031337510..5837135b3 100644 --- a/packages/select/src/select.vue +++ b/packages/select/src/select.vue @@ -32,13 +32,13 @@ - {{ item.currentLabel }} + {{ item.currentLabel }} @@ -771,6 +771,7 @@ }, deleteTag(event, tag) { + console.log(tag) let index = this.selected.indexOf(tag); if (index > -1 && !this.selectDisabled) { const value = this.value.slice(); diff --git a/packages/theme-chalk/src/select-dropdown.scss b/packages/theme-chalk/src/select-dropdown.scss index 8fb607c3a..4b9f251b3 100644 --- a/packages/theme-chalk/src/select-dropdown.scss +++ b/packages/theme-chalk/src/select-dropdown.scss @@ -35,6 +35,9 @@ -moz-osx-font-smoothing: grayscale; } } + & .el-select-dropdown__item.selected.is-disabled { + color: #C0C4CC; + } } .el-scrollbar.is-empty .el-select-dropdown__list{ diff --git a/packages/theme-chalk/src/select.scss b/packages/theme-chalk/src/select.scss index f337ae99c..38f1e5384 100644 --- a/packages/theme-chalk/src/select.scss +++ b/packages/theme-chalk/src/select.scss @@ -12,11 +12,16 @@ display: inline-block; position: relative; - .el-select__tags - >span { + .el-select__tags { + &>span { display: contents; } - + .is-disabled{ + color: #C0C4CC; + cursor: not-allowed; + } + } + &:hover { .el-input__inner { border-color: $--select-border-color-hover;