解决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 相关文章推荐
javascript学习网址备忘
May 29 Javascript
基于jQuery的message插件实现右下角弹出消息框
Jan 11 Javascript
用jquery写的菜单从左往右滑动出现
Apr 11 Javascript
js实现跨域的方法实例详解
Jun 24 Javascript
AngularJS内建服务$location及其功能详解
Jul 01 Javascript
Angular 开发学习之Angular CLI的安装使用
Dec 31 Javascript
Element input树型下拉框的实现代码
Dec 21 Javascript
如何实现双向绑定mvvm的原理实现
May 28 Javascript
原生javascript的ajax请求及后台PHP响应操作示例
Feb 24 Javascript
微信小程序 flexbox layout快速实现基本布局的解决方案
Mar 24 Javascript
基于vue hash模式微信分享#号的解决
Sep 07 Javascript
详解webpack的clean-webpack-plugin插件报错
Oct 16 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
MySql 按时间段查询数据方法(实例说明)
2008/11/02 PHP
使用PHP提取视频网站页面中的FLASH地址的代码
2010/04/17 PHP
PHP实现广度优先搜索算法(BFS,Broad First Search)详解
2017/09/16 PHP
jQuery 幻灯片插件(带缩略图功能)
2011/01/24 Javascript
javascript和HTML5利用canvas构建猜牌游戏实现算法
2013/07/17 Javascript
jquery检测input checked 控件是否被选中的方法
2014/03/26 Javascript
浅谈javascript 迭代方法
2015/01/21 Javascript
angularJS 中$attrs方法使用指南
2015/02/09 Javascript
javascript判断网页是关闭还是刷新
2015/09/12 Javascript
详解JavaScript数组的操作大全
2015/10/19 Javascript
浅谈JS中逗号运算符的用法
2016/06/12 Javascript
详解支持Angular 2的表格控件
2017/01/19 Javascript
详解webpack和webpack-simple中如何引入css文件
2017/06/28 Javascript
JavaScript调试之console.log调试的一个小技巧分享
2017/08/07 Javascript
Angularjs使用过滤器完成排序功能
2017/09/20 Javascript
简单了解TypeScript中如何继承 Error 类
2019/06/21 Javascript
如何在Vue中抽离接口配置文件
2019/10/31 Javascript
vue-cli打包后本地运行dist文件中的index.html操作
2020/08/12 Javascript
[55:03]完美世界DOTA2联赛PWL S2 LBZS vs FTD.C 第二场 11.20
2020/11/20 DOTA
简单的Python抓taobao图片爬虫
2014/10/26 Python
Python的ORM框架中SQLAlchemy库的查询操作的教程
2015/04/25 Python
Python脚本实时处理log文件的方法
2016/11/21 Python
python pandas 如何替换某列的一个值
2018/06/09 Python
正则给header的冒号两边参数添加单引号(Python请求用)
2019/08/09 Python
Python字典fromkeys()方法使用代码实例
2020/07/20 Python
AE美国鹰日本官方网站: American Eagle Outfitters
2016/12/10 全球购物
新西兰最大的在线设计师眼镜店:SmartBuyGlasses新西兰
2017/10/20 全球购物
大学生演讲稿范文
2014/01/11 职场文书
初中科学教学反思
2014/01/21 职场文书
迟到检讨书
2015/01/26 职场文书
琅琊山导游词
2015/02/05 职场文书
餐厅服务员管理制度
2015/08/05 职场文书
描写九月优美句子(39条)
2019/09/11 职场文书
CSS基础详解
2021/10/16 HTML / CSS
图文详解nginx日志切割的实现
2022/01/18 Servers
html5调用摄像头截图功能
2022/01/18 Javascript