el-select选中只能获取到value的值,获取不到label的值,所以要循环匹配筛选获取label的值。

html部分:

<!-- 险种筛选框 -->
<div class="one">
    <el-form :label-position="labelPosition">
        <el-form-item label="险种:" :label-width="formLabelWidth">
            <el-select v-model="valueList" multiple  placeholder="全选" style="width: 500px" @change="insuranceNameSelect" @remove-tag="removeTagSelect">
                <el-option 
                    v-for="item in options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                </el-option>
            </el-select>
        </el-form-item>
    </el-form>
</div>

js部分:

export default {
    data(){
        return {
            formLabelWidth:"160px",
            labelPosition: "left",
            valueList:[],
            valueListSelected:[],
            options:[
                {
                    value:"1",
                    label:"家安芯A款"
                },
                {
                    value:"2",
                    label:"家安芯B款"
                },
                {
                    value:"3",
                    label:"家安芯C款"
                },{
                    value:"4",
                    label:"家安芯D款"
                },
                {
                    value:"5",
                    label:"家安芯E款"
                },
                {
                    value:"6",
                    label:"家安芯F款"
                },{
                    value:"7",
                    label:"家安芯D款"
                },
                {
                    value:"8",
                    label:"家安芯E款"
                },
                {
                    value:"9",
                    label:"家安芯F款"
                },{
                    value:"10",
                    label:"家安芯D款"
                },
                {
                    value:"11",
                    label:"家安芯E款"
                },
                {
                    value:"12",
                    label:"家安芯F款"
                }],
        }
    },
    methods:{
        insuranceNameSelect(val){
            console.log(val, '==========险种选中==========');
            this.valueListSelected = [];
            for(let i =0; i<val.length; i++){
                this.options.find(item => { //这里的options就是数据源
                    if(item.value == val[i]){
                        this.valueListSelected.push({value:item.value, label:item.label})
                    }
                })
            }
            console.log(this.valueListSelected, '==========valueListSelected===========');
        },
        removeTagSelect(tag){
            console.log(tag, "=========tag=========");
        },
    
    }
}

Logo

前往低代码交流专区

更多推荐