直接在v-for渲染option选项里使用disable:
<tempalte>
<div>
<select v-model="customValue" :style="{height: _height}">
<option
v-for="item in customList"
:key="item.value"
:disabled="item.value == 0"
:value="item.value">
{{item.name}}
</option>
</select>
</div>
</template>
<script>
export default{
data(){
return {
customList: [
{name: '全部国家', value:0},
{name: '中国', value:1},
{name: '俄罗斯', value:2},
{name: '英国', value:3},
{name: '日本', value:4},
{name: '韩国', value:5},
{name: '越南', value:6},
{name: '加拿大', value:7},
{name: '意大利', value:8},
],
customValue: 0,
}
}
}
</script>
主要起禁用代码:disabled="item.value == 0",这里通过对比item.value==0去筛选customListde的{name: "全部国家",value:0}禁用。
版权声明:本文为xinfeiyanwu1原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。