vue项目中做编辑功能传递数据时遇到问题的解决方法


Posted in Javascript onDecember 19, 2016

在项目中完成编辑功能时,遇到了这样一个问题:编辑的功能使用的是一个子组件作为弹出框,如图

vue项目中做编辑功能传递数据时遇到问题的解决方法

这里涉及到从父组件向子组件传递数据的问题,这个项目使用的是v1.0,问题是当点击了编辑以后,弹出的子组件中没有获取到父组件传过来的数据,检查后没有发现代码错误,最后解决的方法就是在父组件中,把传递的数据中的每一项都初始化了一遍就好了

creatIssue (type,list,id){
    this.modelIssue=true;
    this.modeltype=type;
    if(type=='creat'){
     this.listdb.executorName='';
     this.listdb.executorId='';
     this.listdb.state='';
     this.listdb.ProjVerId='';
     this.listdb.content='';
     this.issueTitle="创建问题至";
    }else if(type=='edit'){
     this.listdb={...list};   // 解构数据,只用list的数值,不用list的地址
     this.editId=id;
     this.issueTitle="编辑问题";
    }
   },

这是点击编辑时执行的方法,下面是向子组件传递的数据

listdb:{
  executorName:'',
  executorId:'',
  state:'',
  ProjVerId:'',
  content:''
},

开始的时候,只是定义了一个空的数据像这样:

listdb:{},

这种情况下就不会向子组件传递数据,当把要传递的每一项内容都定义了一遍以后就好了,像上面的那种写法。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Javascript学习笔记8 用JSON做原型
Jan 11 Javascript
ajax 缓存 问题 requestheader
Aug 01 Javascript
从jQuery.camelCase()学习string.replace() 函数学习
Sep 13 Javascript
jQuery替换字符串(实例代码)
Nov 13 Javascript
动态创建script在IE中缓存js文件时导致编码的解决方法
May 04 Javascript
jQuery插件jFade实现鼠标经过的图片高亮其它变暗
Mar 14 Javascript
javascript实现俄罗斯方块游戏的思路和方法
Apr 27 Javascript
js实现弹窗暗层效果
Jan 16 Javascript
Angular中使用MathJax遇到的一些问题
Dec 15 Javascript
vue-cli启动本地服务局域网不能访问的原因分析
Jan 22 Javascript
element中el-container容器与div布局区分详解
May 13 Javascript
在VUE中使用lodash的debounce和throttle操作
Nov 09 Javascript
jQuery Easyui datagrid行内实现【添加】、【编辑】、【上移】、【下移】
Dec 19 #Javascript
Jquery Easyui表单组件Form使用详解(30)
Dec 19 #Javascript
基于JavaScript实现自动更新倒计时效果
Dec 19 #Javascript
Bootstrap的基本应用要点浅析
Dec 19 #Javascript
详解javascript获取url信息的常见方法
Dec 19 #Javascript
js封装tab标签页实例分享
Dec 19 #Javascript
jQuery焦点图轮播效果实现方法
Dec 19 #Javascript
You might like
PHP文件上传实例详解!!!
2007/01/02 PHP
MYSQL 小技巧 -- LAST_INSERT_ID
2009/11/24 PHP
php addslashes及其他清除空格的方法是不安全的
2012/01/25 PHP
php_imagick实现图片剪切、旋转、锐化、减色或增加特效的方法
2014/12/15 PHP
ThinkPHP6.0如何利用自定义验证规则规范的实现登陆
2020/12/16 PHP
Thinkphp5+Redis实现商品秒杀代码实例讲解
2020/12/29 PHP
Extjs4中Form的使用之本地hiddenfield
2013/11/26 Javascript
js window.open弹出新的网页窗口
2014/01/16 Javascript
js实现动画特效的文字链接鼠标悬停提示的方法
2015/03/02 Javascript
简单谈谈javascript Date类型
2015/09/06 Javascript
Javascript中常见的逻辑题和解决方法
2016/09/17 Javascript
微信小程序中实现手指缩放图片的示例代码
2018/03/13 Javascript
使用jQuery动态设置单选框的选中效果
2018/12/06 jQuery
jQuery实现模拟搜索引擎的智能提示功能简单示例
2019/01/27 jQuery
纯javascript实现选择框的全选与反选功能
2019/04/08 Javascript
vue移动端使用appClound拉起支付宝支付的实现方法
2019/11/21 Javascript
vue quill editor 使用富文本添加上传音频功能
2020/01/14 Javascript
[50:01]Ti4 冒泡赛第二天 NEWBEE vs Titan
2014/07/15 DOTA
Python使用Pycrypto库进行RSA加密的方法详解
2016/06/06 Python
WINDOWS 同时安装 python2 python3 后 pip 错误的解决方法
2017/03/16 Python
python调用虹软2.0第三版的具体使用
2019/02/22 Python
python实现PID算法及测试的例子
2019/08/08 Python
Python3列表List入门知识附实例
2020/02/09 Python
解决Keras 中加入lambda层无法正常载入模型问题
2020/06/16 Python
python在地图上画比例的实例详解
2020/11/13 Python
Python使用tkinter实现小时钟效果
2021/02/22 Python
英国第一豪华护肤品牌:Elemis
2017/10/12 全球购物
KARATOV珠宝在线商店:俄罗斯珠宝品牌
2019/03/13 全球购物
班组安全员工作职责
2014/02/01 职场文书
企业业务员岗位职责
2014/03/14 职场文书
2014卖家双十一活动策划书
2014/09/29 职场文书
庆七一宣传标语
2014/10/08 职场文书
关于运动会广播稿50字
2014/10/18 职场文书
职工趣味运动会开幕词
2016/03/04 职场文书
Java实现二维数组和稀疏数组之间的转换
2021/06/27 Java/Android
日本十大血腥动漫,那些被禁播的动漫盘点
2022/03/21 日漫