解决vue动态下拉菜单 有数据未反应的问题


Posted in Javascript onAugust 06, 2020

问题出现在当时后台数据会返回到data中但是没有出现下拉菜单,查询资料 发现 Vue的this理解有误

jsp 下拉菜单

<select name="plantModelParentId" v-model="vueObj.plantModelParentId" @change="selectChange">
 <option value=""></option>
 <option v-for="(item,index) in selectlist" :value="index"> {{item.plantModelName}}</option>
</select>

JS

new Vue({
 el : "#vueadd",
 data : {
 vueObj : {},
 selectlist : []
 },
 created : function() {
 // 判断搜索是否为父级为空
 var a = 0;
  //var self=this.selectlist出错 原因是并未找到selectlist 经过查询资料this指向的事new Vue
 var self=this; 
 $.ajax({
  type : "post",
  url : basePath + "/cultmanage/seachCult.do",
  dataType : 'json',
  data : {
  plantModelParentId : a,
  },
  success : function(data) {
  //会返回后台的值 但是没出现下拉框 
  //console.log(JSON.stringify(data));
  self.selectlist = data;
  },
  error : function(data, type, err) {
  alert("错误类型:" + type + "; 错误信息:" + err);
  }
 });
 }

补充知识:vue+elementUI导航中,点击body子菜单收缩的问题

项目中用到了vue+elementUI,发现点击body导航子菜单会收缩的问题

原因:是elementUI版本的问题,发现我使用的是2.4.11版本,卸载重新安装2.4.9版本就可以了

安装命令:

cnpm uninstall element-ui//卸载

cnpm install element-ui@2.4.9 --save

以上这篇解决vue动态下拉菜单 有数据未反应的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jQuery 工具函数学习资料
Apr 29 Javascript
JavaScript 放大镜 放大倍率和视窗尺寸
May 09 Javascript
js获取GridView中行数据的两种方法 分享
Jul 13 Javascript
JS控制阿拉伯数字转为中文大写示例代码
Sep 04 Javascript
Javascript 实现图片无缝滚动
Dec 19 Javascript
jquery实现在光标位置插入内容的方法
Feb 05 Javascript
前端构建工具之gulp的语法教程
Jun 12 Javascript
打字效果动画的4种实现方法(超简单)
Oct 18 Javascript
vue.js input框之间赋值方法
Aug 24 Javascript
React 项目迁移 Webpack Babel7的实现
Sep 12 Javascript
深入理解Node内建模块和对象
Mar 12 Javascript
JavaScript一元正号运算符示例代码
Jun 30 Javascript
JavaScript中ES6规范中let和const的用法和区别
Aug 06 #Javascript
在vue项目中利用popstate处理页面返回的操作介绍
Aug 06 #Javascript
JavaScript中作用域链的概念及用途讲解
Aug 06 #Javascript
解决vue字符串换行问题(绝对管用)
Aug 06 #Javascript
vue 路由缓存 路由嵌套 路由守卫 监听物理返回操作
Aug 06 #Javascript
Vue Router中应用中间件的方法
Aug 06 #Javascript
JavaScript的垃圾回收机制与内存管理
Aug 06 #Javascript
You might like
source.php查看源文件
2006/12/09 PHP
PHP session有效期session.gc_maxlifetime
2011/04/20 PHP
php面向对象中static静态属性与方法的内存位置分析
2015/02/08 PHP
jquery随意添加移除html的实现代码
2011/06/21 Javascript
JavaScript中使用构造器创建对象无需new的情况说明
2012/03/01 Javascript
Extjs4 关于Store的一些操作(加载/回调/添加)
2013/04/18 Javascript
使用nodejs开发cli项目实例
2015/06/03 NodeJs
js+html5实现canvas绘制镂空字体文本的方法
2015/06/05 Javascript
JavaScript中利用Array和Object实现Map的方法
2015/07/27 Javascript
javascript封装简单实现方法
2015/08/11 Javascript
实例解析jQuery插件EasyUI最常用的表单验证规则
2015/11/29 Javascript
浅析angularJS中的ui-router和ng-grid模块
2016/05/20 Javascript
jQuery实现为LI列表前3行设置样式的方法【2种方法】
2016/09/04 Javascript
浅析如何利用angular结合translate为项目实现国际化
2016/12/08 Javascript
JS中用childNodes获取子元素换行会产生一个子元素
2016/12/08 Javascript
EasyUI折叠表格层次显示detailview详解及实例
2016/12/28 Javascript
详解React 在服务端渲染的实现
2017/11/16 Javascript
详解如何使用webpack打包多页jquery项目
2019/02/01 jQuery
微信小程序云开发详细教程
2019/05/16 Javascript
javascript 关于赋值、浅拷贝、深拷贝的个人理解
2019/11/01 Javascript
微信小程序报错: thirdScriptError的错误问题
2020/06/19 Javascript
[53:50]CHAOS vs Mineski 2019国际邀请赛小组赛 BO2 第一场 8.16
2019/08/18 DOTA
python网络编程学习笔记(六):Web客户端访问
2014/06/09 Python
python使用WMI检测windows系统信息、硬盘信息、网卡信息的方法
2015/05/15 Python
利用python爬取散文网的文章实例教程
2017/06/18 Python
python 递归深度优先搜索与广度优先搜索算法模拟实现
2018/10/22 Python
Pytorch中index_select() 函数的实现理解
2019/11/19 Python
python列表切片和嵌套列表取值操作详解
2020/02/27 Python
python3中datetime库,time库以及pandas中的时间函数区别与详解
2020/04/16 Python
python map比for循环快在哪
2020/09/21 Python
CSS3+Sprite实现僵尸行走动画特效源码
2016/01/27 HTML / CSS
马德里著名的运动鞋商店:NOIRFONCE
2019/04/12 全球购物
英语专业大学生求职简历的自我评价
2013/10/18 职场文书
2015年重阳节慰问信
2015/03/23 职场文书
2015年禁毒宣传活动总结
2015/03/25 职场文书
Python 第三方库 openpyxl 的安装过程
2022/12/24 Python