解决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 相关文章推荐
return false,对阻止事件默认动作的一些测试代码
Nov 17 Javascript
分享27个jQuery 表单插件集合推荐
Apr 25 Javascript
Js如何判断客户端是PC还是手持设备简单分析
Nov 22 Javascript
纯javascript制作日历控件
Jul 17 Javascript
jQuery实现图片与文字描述左右滑动自动切换的方法
Jul 27 Javascript
JavaScript自学笔记(必看篇)
Jun 23 Javascript
利用React-router+Webpack快速构建react程序
Oct 27 Javascript
Angular2利用组件与指令实现图片轮播组件
Mar 27 Javascript
详细讲解如何创建, 发布自己的 Vue UI 组件库
May 29 Javascript
JS开发常用工具函数(小结)
Jul 04 Javascript
详解BootStrap表单验证中重置BootStrap-select验证提示不清除的坑
Sep 17 Javascript
JS前端模块化原理与实现方法详解
Mar 17 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
德生PL660的电路分析和打磨
2021/03/02 无线电
在PHP语言中使用JSON和将json还原成数组的方法
2016/07/19 PHP
PHP实现随机数字、字母的验证码功能
2018/08/01 PHP
php中钩子(hook)的原理与简单应用demo示例
2019/09/03 PHP
仅Firefox中链接A无法实现模拟点击以触发其默认行为
2011/07/31 Javascript
有关JavaScript的10个怪癖和秘密分享
2011/08/28 Javascript
jquery中加载图片自适应大小主要实现代码
2013/08/23 Javascript
Javascript验证用户输入URL地址是否为空及格式是否正确
2014/10/09 Javascript
javascript中slice(),splice(),split(),substring(),substr()使用方法
2015/03/13 Javascript
JavaScript实现简单Tip提示框效果
2016/04/20 Javascript
JavaScript中获取时间的函数集
2016/08/16 Javascript
JavaScript实现打地鼠小游戏
2020/04/23 Javascript
React Native 环境搭建的教程
2017/08/19 Javascript
JavaScript数组、json对象、eval()函数用法实例分析
2019/02/21 Javascript
Vue项目history模式下微信分享爬坑总结
2019/03/29 Javascript
基于Node的Axure文件在线预览的实现代码
2019/08/28 Javascript
Electron 调用命令行(cmd)
2019/09/23 Javascript
vue路由 遍历生成复数router-link的例子
2019/10/30 Javascript
[05:26]TI10典藏宝瓶套装外观展示
2020/07/03 DOTA
Python实现获取域名所用服务器的真实IP
2015/10/25 Python
使用numpy和PIL进行简单的图像处理方法
2018/07/02 Python
Python统计python文件中代码,注释及空白对应的行数示例【测试可用】
2018/07/25 Python
使用Python的networkx绘制精美网络图教程
2019/11/21 Python
python 实现一个反向单位矩阵示例
2019/11/29 Python
Scrapy框架实现的登录网站操作示例
2020/02/06 Python
Skyscanner阿联酋:全球领先的旅游搜索平台
2017/11/25 全球购物
Lookfantastic瑞典:英国知名美妆购物网站
2018/04/06 全球购物
台湾母婴用品购物网站:Infant婴之房
2018/06/15 全球购物
结构和类有什么异同
2012/07/16 面试题
企业宣传标语
2014/06/09 职场文书
婚宴邀请函
2015/01/30 职场文书
2015年学校远程教育工作总结
2015/07/20 职场文书
《鸡兔同笼》教学反思
2016/02/19 职场文书
apache基于端口创建虚拟主机的示例
2021/04/22 Servers
在Windows Server 2012上安装 .NET Framework 3.5 所遇到的问题
2022/04/29 Servers
python如何将mat文件转为png
2022/07/15 Python