解决element ui select下拉框不回显数据问题的解决


Posted in Javascript onFebruary 20, 2019

最近在做一个项目,项目的后端是地址: https://github.com/wangyuanjun008/wyj-springboot-security.git
前端地址是 https://github.com/wangyuanjun008/wyj-vue-security.git ,使用的前端语言是vue,使用webpack构建vue-cli全家桶

在项目中用到 el-select 时遇到一个问题,就是在编辑表单时,下拉框的不显示数据,前台代码如下:

<el-select v-model="commonForm.status" clearable placeholder="请选择">
 <el-option v-for="item in items" :key="item.id" :label="item.text" :value="item.id" ></el-option>
</el-select>

在浏览器中查看列表返回的数据:

解决element ui select下拉框不回显数据问题的解决

在浏览器中查看下拉框数据源的数据:

解决element ui select下拉框不回显数据问题的解决

发现select下拉的id和v-model里边的id类型不一致,修改后台下拉框数据源返回类型,下拉框显示数据成功。

解决element ui select下拉框不回显数据问题的解决

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JS获取下拉列表所选中的TEXT和Value的实现代码
Jan 11 Javascript
图片放大镜jquery.jqzoom.js使用实例附放大镜图标
Jun 19 Javascript
Javascript中的关键字和保留字整理
Oct 16 Javascript
jQuery实现拖动调整表格单元格大小的代码实例
Jan 13 Javascript
深入理解setTimeout函数和setInterval函数
May 20 Javascript
Bootstrap模态框(modal)垂直居中的实例代码
Aug 18 Javascript
JavaScript获取URL中参数querystring的方法详解
Oct 11 Javascript
学习vue.js计算属性
Dec 03 Javascript
初探js和简单隐藏效果的实例
Nov 23 Javascript
如何编写一个d.ts文件的步骤详解
Apr 13 Javascript
vuex直接赋值的三种方法总结
Sep 16 Javascript
vue-cli4项目开启eslint保存时自动格式问题
Jul 13 Javascript
微信小程序五子棋游戏的悔棋实现方法【附demo源码下载】
Feb 20 #Javascript
Vue.js特性Scoped Slots的浅析
Feb 20 #Javascript
微信小程序五子棋游戏的棋盘,重置,对弈实现方法【附demo源码下载】
Feb 20 #Javascript
详解关于element级联选择器数据回显问题
Feb 20 #Javascript
JavaScript ES2019中的8个新特性详解
Feb 20 #Javascript
echarts实现词云自定义形状的示例代码
Feb 20 #Javascript
JS拖拽排序插件Sortable.js用法实例分析
Feb 20 #Javascript
You might like
php实现paypal 授权登录
2015/05/28 PHP
Linux php 中文乱码的快速解决方法
2016/05/13 PHP
PHP数组相加操作及与array_merge的区别浅析
2016/11/26 PHP
Laravel使用消息队列需要注意的一些问题
2017/12/13 PHP
php+js实现裁剪任意形状图片
2018/10/31 PHP
一个js的tab切换效果代码[代码分离]
2010/04/11 Javascript
js中的this关键字详解
2013/09/25 Javascript
jQuery实现等比例缩放大图片让大图片自适应页面布局
2013/10/16 Javascript
jquery fancybox ie6不显示关闭按钮的解决办法
2013/12/25 Javascript
Javascript之Math对象详解
2016/06/07 Javascript
全面了解JavaScript对象进阶
2016/07/19 Javascript
利用JS提交表单的几种方法和验证(必看篇)
2016/09/17 Javascript
JS实现的自动打字效果示例
2017/03/10 Javascript
Vuejs 页面的区域化与组件封装的实现
2017/09/11 Javascript
判断滚动条滑到底部触发事件(实例讲解)
2017/11/15 Javascript
在 Angular6 中使用 HTTP 请求服务端数据的步骤详解
2018/08/06 Javascript
vue中使用cookies和crypto-js实现记住密码和加密的方法
2018/10/18 Javascript
React事件处理的机制及原理
2018/12/03 Javascript
在JavaScript中使用严格模式(Strict Mode)
2019/06/13 Javascript
微信小程序new Date()方法失效问题解决方法
2019/07/29 Javascript
基于vue3.0.1beta搭建仿京东的电商H5项目
2020/05/06 Javascript
JavaScript链式调用原理与实现方法详解
2020/05/16 Javascript
在vue中使用inheritAttrs实现组件的扩展性介绍
2020/12/07 Vue.js
[03:00]2018完美盛典_最佳英雄奖
2018/12/17 DOTA
python抓取网页内容示例分享
2014/02/24 Python
Python面向对象之类和对象实例详解
2018/12/10 Python
Pandas之DataFrame对象的列和索引之间的转化
2019/06/25 Python
Python用类实现扑克牌发牌的示例代码
2020/06/01 Python
Surfdome西班牙:世界上最受欢迎的生活方式品牌
2019/02/13 全球购物
康拓普公司Java笔面试
2016/09/23 面试题
Hashtable 添加内容的方式有哪几种,有什么区别?
2012/04/08 面试题
几道Java和数据库的面试题
2013/05/30 面试题
职称自我鉴定
2013/10/15 职场文书
专题组织生活会发言材料
2014/10/17 职场文书
走进科学观后感
2015/06/18 职场文书
canvas绘制折线路径动画实现
2021/05/12 Javascript