当前位置：网站首页>el-select 中v-model绑定值，数据回显只显示value，不显示label

el-select 中v-model绑定值，数据回显只显示value，不显示label

2022-04-23 06:17:00 【ZMJ_QQ】

1、当v-model绑定的是一个值时

<el-select v-model="modelTree" filterable>
   <el-option v-for="item in nameList" :key="item.id" :label="item.title" :value="item.id">
   </el-option>
</el-select>

数据回显只显示value,不显示label，原因可能有以下几个：

1、option的数据中不存在该value值，

2、option的中的value值和v-model绑定的值，数据类型不一致，console.log打印一下两个数据的类型是否一致，不一致的话转成对应的类型就可以。

3、如果数据回显时，先显示value值后显示label值，是因为页面中option下拉框的数据还没有获取到，所以先显示的value值，可以在页面中加一个loading

2、当v-model绑定的是一个对象时

<el-select v-model="user" value-key="id" >
    <el-option
         v-for="item in users"
         :key="item.id"     
         :label="item.name"
         :value="item"
    />
</el-select>

1、value-key绑定的属性值是否和 :key中绑定的对象的值相等