el-select 多选框，默认值不可删除实现方法。

水深无声 2022-09-10 10:28 963阅读 0赞

## elementui el-select 多选框，默认值不可删除实现方法。只限固定的默认值 ##

<el-select v-model="value1" multiple placeholder="请选择" @change="handleChose">
                <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
                </el-option>
            </el-select>

data: { 
                    options: [{ 
                        value: '1',
                        label: '黄金糕'
                    }, { 
                        value: '2',
                        label: '双皮奶'
                    }, { 
                        value: '3',
                        label: '蚵仔煎'
                    }, { 
                        value: '4',
                        label: '龙须面'
                    }, { 
                        value: '5',
                        label: '北京烤鸭'
                    }],
                    value1: ['1', '2'],

handleChose(val) { 
                        console.log(val);
                        if (val.indexOf('1') == -1) { 
                            this.$message({ 
                                type: 'warning',
                                message: '不能删除'
                            })
                            this.value1.unshift('1');
                        }
    
                        if (val.indexOf('2') == -1) { 
                            this.$message({ 
                                type: 'warning',
                                message: '不能删除'
                            })
                        }
                        this.value1.splice(1, 0, '2')
                    },