解决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 相关文章推荐
node+express+ejs制作简单页面上手指南
Nov 26 Javascript
jquery中JSON的解析方式
Mar 16 Javascript
jquery动态导航插件dynamicNav用法实例分析
Sep 06 Javascript
微信小程序 Audio API详解及实例代码
Sep 30 Javascript
javascript使用闭包模拟对象的私有属性和方法
Oct 05 Javascript
用director.js实现前端路由使用实例
Jan 27 Javascript
微信小程序实现列表下拉刷新上拉加载
Jul 29 Javascript
Vue下路由History模式打包后页面空白的解决方法
Jun 29 Javascript
使用js实现单链解决前端队列问题的方法
Feb 03 Javascript
Vue 实现对quill-editor组件中的工具栏添加title
Aug 03 Javascript
解决vue刷新页面以后丢失store的数据问题
Aug 11 Javascript
5种方法告诉你如何使JavaScript 代码库更干净
Sep 15 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
浅析application/x-www-form-urlencoded和multipart/form-data的区别
2014/06/22 PHP
详解yii2使用多个数据库的案例
2017/06/16 PHP
来自chinaz的ajax获取评论代码
2008/05/03 Javascript
jquery easyui使用心得
2014/07/07 Javascript
jquery自定义表格样式
2015/11/23 Javascript
深入浅析JavaScript中数据共享和数据传递
2016/04/25 Javascript
浅谈AngularJS中使用$resource(已更新)
2017/09/14 Javascript
如何重置vue打印变量的显示方式
2017/12/06 Javascript
vue ssr 指南详读
2018/06/29 Javascript
Vue实现购物车详情页面的方法
2019/08/20 Javascript
vue中uni-app 实现小程序登录注册功能
2019/10/12 Javascript
[03:03]2014DOTA2国际邀请赛 EG战队专访
2014/07/12 DOTA
[00:35]DOTA2上海特级锦标赛 VP战队宣传片
2016/03/04 DOTA
[01:45]典藏宝瓶2+祈求者身心——这就是DOTA2TI9总奖金突破3000万美元的秘密
2019/07/21 DOTA
python3.0 字典key排序
2008/12/24 Python
python中使用OpenCV进行人脸检测的例子
2014/04/18 Python
Python实现子类调用父类的方法
2014/11/10 Python
Python与shell的3种交互方式介绍
2015/04/11 Python
Python中random模块用法实例分析
2015/05/19 Python
【Python】Python的urllib模块、urllib2模块批量进行网页下载文件
2016/11/19 Python
Python绑定方法与非绑定方法详解
2017/08/18 Python
使用Python的turtle模块画图的方法
2017/11/15 Python
Python趣味实例,实现一个简单的抽奖刮刮卡
2020/07/18 Python
HTML5之SVG 2D入门2—图形绘制(基本形状)介绍及使用
2013/01/30 HTML / CSS
斯洛伐克最大的婴儿食品和用品网上商店:Feedo.sk
2020/12/21 全球购物
自我鉴定思想方面
2013/10/07 职场文书
工程造价自荐信
2013/10/09 职场文书
大一军训感言
2014/01/09 职场文书
施工质量承诺书范文
2014/05/30 职场文书
文艺演出策划方案
2014/06/07 职场文书
我的中国梦口号
2014/06/16 职场文书
小学“向国旗敬礼”网上签名寄语活动总结
2014/09/27 职场文书
会议接待欢迎标语
2014/10/08 职场文书
调任通知
2015/04/21 职场文书
2015年检验科工作总结
2015/04/27 职场文书
剖析后OpLog订阅MongoDB的数据变更就没那么难了
2022/02/24 MongoDB