vue中父组件给子组件额外添加参数
1 子组件:
this.$emit('callbackone',item.parentId)
2 父组件:
@callbackone="callbackone($event,index)"
3 父祖件调用方法:
callbackone($event,index){
console.log($event,index);
},
父组件使用 $event 来表示子组件传递过来的参数。
==============
vue监听数组变化:
handleMyTask(index,idx){
this.taskArr.map((item,index1)=>{
item.jobProgress.map((value,index2)=>{
if(index1==index && index2==idx){
value.selectFlag = 'on';
}else{
value.selectFlag = '';
}
})
})
console.log(this.taskArr);
},
上述方法 虽然可以改变 taskArr数组 但是vue监听不到,所以要改成下面的方式:
handleMyTask(index,idx){
let newTask = JSON.parse(JSON.stringify(this.taskArr));
newTask.map((item,index1)=>{
item.jobProgress.map((value,index2)=>{
if(index1==index && index2==idx){
value.selectFlag = 'on';
}else{
value.selectFlag = '';
}
})
})
this.taskArr = newTask;
},
即给状态值重新赋值;
vue中父组件给子组件额外添加参数的更多相关文章
- vue中父级与子组件生命周期的先后顺序
1.vue的生命周期 2.views/createrCustormer.vue为父级 <template> <expressService /> </ ...
- Vue中利用$emit实现子组件向父组件通信
Vue中利用$emit实现子组件向父组件通信 父组件 <template> <div> <p>我是父组件</p> <child :isShow=& ...
- vue单文件组件形成父子(子父)组件之间通信(vue父组件传递数据给子组件,子组件传递数据给父组件)
看了很多文章,官网文档也有看,对父子组件通信说的不是很明白:决定自己总结一下: vue一般都使用构建工具构建项目:这样每个组件都是单文件组件:而网上很多文章都是script标签方式映入vue,组件通信 ...
- vue-父组件向子组件传值
一.父组件向子组件传值 其实该问题是说子组件如何访问父组件的属性和方法?那么根据对组件化的理解,无非就是要解决两个问题: 1.父组件如何将值传给子组件? 2.子组件如何获取父组件传递过来的值? 解读v ...
- Vue中,父组件向子组件传值
1:在src/components/child/文件夹下,创建一个名为:child.vue的子组件 2:在父组件中,设置好需要传递的数据 3:在App.vue中引入并注册子组件 4:通过v-bind属 ...
- Vue中父组件向子组件传值
Vue中父组件向子组件传值 相关Html: <!DOCTYPE html> <html lang="en"> <head> <meta c ...
- 042——VUE中组件之子组件使用$on与$emit事件触发父组件实现购物车功能
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- vue中父组件如何监听子组件值的变化
vue中我们会遇到很多父子组件通信的需求, 下面简单列一下,父子组件通信的几种情况 1:父组件向子组件传值:使用prop向子组件传值: 2:子组件实时监听父组件传来的值的变化:使用watch去监听父组 ...
- vue.js中父组件触发子组件中的方法
知识点:vue.js中,父组件的method中,触发子组件中的方法,获得子组件中的定义的属性 (1)子组件 : child_crud.js var html_child_crud= "< ...
- VUe.js 父组件向子组件中传值及方法
父组件向子组件中传值 1. Vue实例可以看做是大的组件,那么在其内部定义的私有组件与这个实例之间就出现了父子组件的对应关系. 2. 父子组件在默认的情况下,子组件是无妨访问到父组件中的数据的,所以 ...
随机推荐
- 转载-Python单元测试框架——unittest
一.Pyhon工作原理—— 核心概念:test case, testsuite, TestLoder,TextTestRunner,TextTestResult, test fixture TestC ...
- hadoop管理命令
-help 功能:输出这个命令参数手册 -ls 功能:显示目录信息 示例: hadoop fs -ls hdfs://hadoop-server01:9000/ 备注:这些参数中,所有的hdfs ...
- Input禁用文本框
<input type="text" readonly="readonly" /> readonly:只读属性:
- 第十三周翻译-《Pro SQL Server Internals, 2nd edition》
<Pro SQL Server Internals, 2nd edition> 作者:Dmitri Korotkevitch 翻译:赖慧芳 译文: 聚集索引 聚集索引指示表中数据的物理顺序 ...
- java虚拟机——垃圾回收机制
问题1:什么是垃圾回收机制? 在java的虚拟机当中,在我们进行实例化的时候,堆会给我们开辟新的空间存放实例.而由于堆,方法区是线程公有,不会像栈区(线程私有)一样随着线程的销毁而销毁.因此在java ...
- 利用Excel-Vba进行多表汇总和数据透视表
汇总表格式 详情表格式 要求根据汇总表中的信息,到详情表中查找详细物料的具体个数 最终,对物料的个数进行汇总,结果如下图: ExcelVba代码如下(有一些注释代码供参考) Sub Start() S ...
- JavaScript||什么是面向对象
什么是对象&面向对象 对象 是一个整体,对外提供功能.例:一个手机 电脑. 面向对象 使用的时候只关注提供的功能不关注内部的细节. 面向对象有三大特点: 抽象:将问题需求抽象出来 例:一个员工 ...
- Qt代码
ui->LoginPushButton->setStyleSheet(//正常状态样式 "QPushButton{" "background-color:rg ...
- [python3.6+opencv] 01 完成读取图片操作
学习一下opencv3 奈何vs2017配的云里雾里,还是使用python吧 --人生苦短,python来凑 --使用Pycharm操作,面向界面的Pycharm好一些吧(我猜的) 新建Project ...
- ppt图片在word中不能正常显示,只显示为矩形框的解决方法
word中插入的其他图片是好的,但是从ppt复制粘贴过来的图片只显示个框. 解决方法:以下红框中内容去选中.