el-select多选情况下回显的问题

多选回选，重点是把会选的数据结构和所有选项区分开

v-model 后台渲染所有选线 他是选中的id 不是跟regionOptions 结构一致。之前就踩过坑，保持一致，数据一致回选失败

regionOptions 是配置所有选项

<el-form-item label-width="200px" label="联通运营商" prop="liantong">
                                            <el-select v-model="ruleForm.operator_region_liantong" multiple="multiple" filterable default-first-option  placeholder="请选择省份" >
                                                <el-option
                                                        v-for="item in regionOptions"
                                                        :key="item.attr_id"
                                                        :label="item.attr_name"
                                                        :value="item.attr_id">
                                                </el-option>
                                            </el-select>
                                    </el-form-item>

使用多选内容  regionOptions

regionOptions: [
    {
        "attr_name": "北京市",
        "attr_id": 2
    },
    {
        "attr_name": "天津市",
        "attr_id": 20
    },
    {
        "attr_name": "河北省",
        "attr_id": 38
    },
    {
        "attr_name": "山西省",
        "attr_id": 218
    },
    {
        "attr_name": "内蒙古自治区",
        "attr_id": 349
    }
    
]

v-model 是会选数据
之前一直以为数据结构与regionOptions一样，
造成结构选择的不是对应的选择
后面经过方法调试，发现，

v-model的数据是id值 即[2,20]

 

 全选：