element-ui中的el-select下拉框选中不显示问题
element
A Vue.js 2.0 UI Toolkit for Web
项目地址:https://gitcode.com/gh_mirrors/eleme/element
免费下载资源
·
最近在使用element的el-select时出现了一个奇怪的坑,就是当我选中了下拉框的内容之后但是下拉框中不展示选中的label值,具体代码如下,先展示出现问题的代码
<el-form-item label="推荐产品一:">
<el-select filterable v-model="detail.recommendProductId" clearable @change="productChange">
<el-option
v-for="(item, key) in detail.productionData"
:key="key"
:label="item.name"
:value="item.id"
></el-option>
</el-select>
</el-form-item>
代码中的this.detail是接口中返回的json数据,是一个对象,对象中也包含数组,this.detail.recommendProductId用来绑定v-model的值,同时this.detail.productionData是下拉列表的数据集合,然后在选中列表是触发productChange函数是生效的,但是在选中之后并没有显示出来,产生这种现象的问题是因为这里的v-model绑定的值和option中的值都是变量,都通过接口来获取的,所以就产生了选中之后不显示的问题,解决这个问题的方法可以是将v-model绑定的值我们写成自定的变量值,比如将detail.recommendProductId变成recommendProductId,或者将option中的数据写死也可以解决掉这个问题
GitHub 加速计划 / eleme / element
54.06 K
14.63 K
下载
A Vue.js 2.0 UI Toolkit for Web
最近提交(Master分支:2 个月前 )
c345bb45
6 个月前
a07f3a59
* Update transition.md
* Update table.md
* Update transition.md
* Update table.md
* Update transition.md
* Update table.md
* Update table.md
* Update transition.md
* Update popover.md 6 个月前
更多推荐
已为社区贡献2条内容
所有评论(0)