解决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 相关文章推荐
firefox火狐浏览器与与ie兼容的2个问题总结
Jul 20 Javascript
jquery实现手机发送验证码的倒计时代码
Feb 12 Javascript
jQuery中的siblings()是什么意思(推荐)
Dec 29 Javascript
springmvc接收jquery提交的数组数据代码分享
Oct 28 jQuery
vue左右侧联动滚动的实现代码
Jun 06 Javascript
基于Vue的商品主图放大镜方案详解
Sep 19 Javascript
JS控制只能输入数字并且最多允许小数点两位
Nov 24 Javascript
iSlider手机端图片滑动切换插件使用详解
Dec 24 Javascript
JS正则表达式验证端口范围(0-65535)
Jan 06 Javascript
浅谈JavaScript中this的指向问题
Jul 28 Javascript
基于JavaScript实现猜数字游戏代码实例
Jul 30 Javascript
vue项目支付功能代码详解
Feb 18 Vue.js
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
PHP中SESSION使用中的一点经验总结
2012/03/30 PHP
PHP运用foreach神奇的转换数组(实例讲解)
2018/02/01 PHP
laravel 实现设置时区的简单方法
2019/10/10 PHP
16个最流行的JavaScript框架[推荐]
2011/05/29 Javascript
Javascript base64编码实现代码
2011/12/02 Javascript
Chosen 基于jquery的选择框插件使用方法
2012/05/30 Javascript
jquery选择器简述
2015/08/31 Javascript
jquery通过扩展select控件实现支持enter或focus选择的方法
2015/11/19 Javascript
js注入 黑客之路必备!
2016/09/14 Javascript
js中json处理总结之JSON.parse
2016/10/14 Javascript
Vue列表页渲染优化详解
2017/07/24 Javascript
Vue 实现树形视图数据功能
2018/05/07 Javascript
angularJS自定义directive之带参方法传递详解
2018/10/09 Javascript
Vue 前端实现登陆拦截及axios 拦截器的使用
2019/07/17 Javascript
手写Vue源码之数据劫持示例详解
2021/01/04 Vue.js
[46:53]Secret vs Liquid 2019国际邀请赛小组赛 BO2 第一场 8.15
2019/08/17 DOTA
python错误处理详解
2014/09/28 Python
Python使用cx_Oracle模块将oracle中数据导出到csv文件的方法
2015/05/16 Python
使用Python来开发Markdown脚本扩展的实例分享
2016/03/04 Python
Python批量修改文本文件内容的方法
2016/04/29 Python
Python 获取当前所在目录的方法详解
2017/08/02 Python
python实现多人聊天室
2020/03/31 Python
Python爬虫 bilibili视频弹幕提取过程详解
2019/07/31 Python
Python学习笔记之列表推导式实例分析
2019/08/13 Python
Django后端发送小程序微信模板消息示例(服务通知)
2019/12/17 Python
tensorflow使用freeze_graph.py将ckpt转为pb文件的方法
2020/04/22 Python
Django之富文本(获取内容,设置内容方式)
2020/05/21 Python
HTML5的hidden属性兼容老浏览器的方法
2014/04/23 HTML / CSS
eDreams意大利:南欧领先的在线旅行社
2018/11/23 全球购物
见习报告怎么写
2014/10/31 职场文书
关于学习的决心书
2015/02/05 职场文书
2015年预防青少年违法犯罪工作总结
2015/05/22 职场文书
有关三国演义的读书笔记
2015/06/25 职场文书
2016寒假假期总结
2015/10/10 职场文书
详细聊聊MySQL中慢SQL优化的方向
2021/08/30 MySQL
Redis集群新增、删除节点以及动态增加内存的方法
2021/09/04 Redis