<template>
<el-select v-model="policy" v-disableSel="[policyMap, policy]" multiple>
<el-option
v-for="item in policyMap"
:key="item.id"
:label="item.name"
:value="item.id"
:disabled="item.disabled">
</el-option>
</el-select>
</template>
<script>
export default {
data () {
return {
policy: ['1', '2'],
policyMap: [
{
id: '1',
name: 'data1'
},
{
id: '2',
name: 'data2',
disabled: true
},
{
id: '3',
name: 'data3'
}
]
}
},
directives: {
disableSel: {
bind (el, bindings) {
const [mapData, selData] = bindings.value
const disableIndex = []
selData.forEach((selItem, index) => {
const selObj = mapData.find(mapItem => mapItem.id === selItem)
if (selObj.disabled) disableIndex.push(index)
})
setTimeout(() => { // bind时，找不到 tags，所以放个延时定时器
const tags = el.querySelectorAll('.el-tag__close')
tags.forEach((tag, index) => {
if (disableIndex.includes(index)) {
tag.classList.add('none')
tab.style.setProperty('display','none')//权重层级更高
}
})
})
}
}
}
}
</script>
<style>
.none {
display: none !important;
}
</style>
select多选时，设置默认不可删除项
©著作权归作者所有,转载或内容合作请联系作者
- 文/潘晓璐 我一进店门，熙熙楼的掌柜王于贵愁眉苦脸地迎上来，“玉大人，你说我怎么就摊上这事。” “怎么了？”我有些...
- 文/花漫 我一把揭开白布。 她就那样静静地躺着，像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上，一...
- 文/苍兰香墨 我猛地睁开眼，长吁一口气：“原来是场噩梦啊……” “哼！你这毒妇竟也来了？” 一声冷哼从身侧响起，我...
推荐阅读更多精彩内容
- 原文路径：https://blog.csdn.net/qq_36356218/article/details/10...
- 最近有用到这个功能，借鉴了https://blog.csdn.net/qq_36356218/article/de...
- 【蝴蝶效应】 蝴蝶效应:上个世纪70年代，美国一个名叫洛伦兹的气象学家在解释空气系统理论时说，亚马逊雨林一只蝴蝶...
- 当我们做web项目时，总是会碰到的一种情况是下拉框的使用，提交数据很简单，但是数据的回显就会遇到一些问题： 我们在...
