解决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 相关文章推荐
javascript onmouseout 解决办法
Jul 17 Javascript
广泛收集的jQuery拖放插件集合
Apr 09 Javascript
JavaScript 反科里化 this [译]
Sep 20 Javascript
setTimeout自动触发一个js的方法
Jan 15 Javascript
Javascript基础知识(三)BOM,DOM总结
Sep 29 Javascript
分享10个原生JavaScript技巧
Apr 20 Javascript
Javascript函数的参数
Jul 16 Javascript
JavaScript实现翻页功能(附效果图)
Feb 16 Javascript
详解webpack require.ensure与require AMD的区别
Dec 13 Javascript
layerUI下的绑定事件实例代码
Aug 17 Javascript
Vue 莹石摄像头直播视频实例代码
Aug 31 Javascript
node脚手架搭建服务器实现token验证的方法
Jan 20 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
[原创]php求圆周率的简单实现方法
2016/05/30 PHP
php strftime函数的详细用法
2018/06/21 PHP
Prototype最新版(1.5 rc2)使用指南(1)
2007/01/10 Javascript
优化 JavaScript 代码的方法小结
2009/07/16 Javascript
JS 表单验证大全
2011/11/23 Javascript
基于jquery的固定表头和列头的代码
2012/05/03 Javascript
js 时间函数应用加、减、比较、格式转换的示例代码
2013/08/23 Javascript
javascript生成随机数的方法
2014/05/16 Javascript
js窗口关闭提示信息(兼容IE和firefox)
2015/10/23 Javascript
jquery分页插件jquery.pagination.js使用方法解析
2016/04/01 Javascript
AngularJS入门之动画
2016/07/27 Javascript
BootStrap的table表头固定tbody滚动的实例代码
2016/08/24 Javascript
使用vue实现点击按钮滑出面板的实现代码
2017/01/10 Javascript
使用D3.js制作图表详解
2017/08/13 Javascript
小程序云函数调用API接口的方法
2019/05/17 Javascript
vue transition 在子组件中失效的解决
2019/11/12 Javascript
[02:40]DOTA2英雄基础教程 炼金术士
2013/12/23 DOTA
[02:00]DOTA2英雄COSPLAY闹市街头巡游助威2015国际邀请赛
2015/08/02 DOTA
Python 操作MySQL详解及实例
2017/04/30 Python
用TensorFlow实现多类支持向量机的示例代码
2018/04/28 Python
用pycharm开发django项目示例代码
2018/10/24 Python
对python3中的RE(正则表达式)-详细总结
2019/07/23 Python
Python 写了个新型冠状病毒疫情传播模拟程序
2020/02/14 Python
浅谈keras通过model.fit_generator训练模型(节省内存)
2020/06/17 Python
用python写PDF转换器的实现
2020/10/29 Python
大学生自我鉴定
2013/12/16 职场文书
表彰先进集体通报
2014/01/12 职场文书
食品厂厂长岗位职责
2014/01/30 职场文书
员工拓展培训方案
2014/02/15 职场文书
房产公证书范本
2014/04/10 职场文书
高中升旗仪式演讲稿
2014/09/09 职场文书
预备党员学习十八届三中全会精神思想汇报
2014/09/13 职场文书
社区国庆节活动总结
2015/03/23 职场文书
家长意见和建议怎么写
2015/06/04 职场文书
班组长如何制订适合本班组的工作计划?
2019/07/10 职场文书
Go缓冲channel和非缓冲channel的区别说明
2021/04/25 Golang