今天在写分页功能时，发现父子组件传值时，子组件监听不到父组件中数据的变化，传递的是一个引用类型的数据

其原因是引用类型共用一个内存地址，父子组件用的是同一个对象，故子组件监听不到变化，此时就需要做一个深拷贝，相关代码如下：

其实param是一个引用类型

将父组件中要传递的值做一个深拷贝，其中self.pageDatasCopy是self.pageDatas的深拷贝，self.pageDatas是父组件中的变量，

子组件监听变化：（watch监听）

vue组件父子组件传递引用类型数据的更多相关文章

  1. Vue 非父子组件通信方案

    Vue 非父子组件通信方案 概述 在 Vue 中模块间的通信很普遍 如果是单纯的父子组件间传递信息,父组件可以使用 props 将数据向下传递到子组件,而在子组件中可以使用 events (父组件需要 ...

  2. 【Vue课堂】Vue.js 父子组件之间通信的十种方式

    这篇文章介绍了Vue.js 父子组件之间通信的十种方式,不管是初学者还是已经在用 Vue 的开发者都会有所收获.无可否认,现在无论大厂还是小厂都已经用上了 Vue.js 框架,简单易上手不说,教程详尽 ...

  3. Vue中父子组件执行的先后顺序

    Vera   Vue中父子组件执行的先后顺序探讨(转载) 前几天,朋友向我提出了一个关于Vue中父子组件执行的先后顺序问题,相信很多朋友在学习的过程中也会遇到这个问题,所以我就在此提出我自己的一些小看 ...

  4. Vue中父子组件执行的先后顺序探讨

    前几天,朋友向我提出了一个关于Vue中父子组件执行的先后顺序问题,相信很多朋友在学习的过程中也会遇到这个问题,所以我就在此提出我自己的一些小看法. 问题如下:请问下图中父子组件执行的先后顺序? 首先, ...

  5. vue组件-构成组件-父子组件相互传递数据

    组件对于vue来说非常重要,学习学习了基础vue后,再回过头来把组件弄透! 一.概念 组件意味着协同工作,通常父子组件会是这样的关系:组件 A 在它的模版中使用了组件 B . 它们之间必然需要相互通信 ...

  6. 关于vue.js父子组件数据传递

    vue.js中使用props down,events up的原则进行父子组件间的通信,先来记录下props down,看个例子: <div id="app2"> < ...

  7. Vue.js 父子组件相互传递数据

    父传子 : 子组件接收变量名=父组件传递的数据 如::f-cmsg="fmsg"  注意驼峰问题 子传父:@子组件关联的方法名 = 父组件接受的方法名 如:@func=" ...

  8. uni-app中vue组件父子值传递

    一.父组件向子组件传递数据(props) <template> <view class="container" style="background: # ...

  9. 简述vue中父子组件是怎样相互传递值的（基础向）

    前言 首先,你需要知道vue中父组件和子组件分别指的是什么?   父组件:vue的根实例——用new Vue()构造函数创建的vue实例(实例会有一个挂载点,挂载点里的所有内容可理解为父组件的内容) ...

随机推荐

  1. OVF and OVA

    最近测试的东西有关于ovf 和ova等相关用例,在网上找了点内容摘抄了下来. 一.什么是OVF文件 开源虚拟化格式OVF文件是一种开源的文件规范,它描述了一个开源.安全.有效.可拓展的便携式虚拟打包以 ...

  2. AWK Demo

    AWK is so poweful. AWK功能太强大了: @1:处理格式化文本(感觉主要还是以这个为主) @2:对文本逐行进行处理(过滤某些行,保留符合条件的) @3:将文件根据不同的条件分成多个文 ...

  3. 【HackerRank】Sherlock and Array

    Watson gives an array A1,A2...AN to Sherlock. Then he asks him to find if there exists an element in ...

  4. Linux的Cache Memory(缓存内存)机制

    转:https://blog.csdn.net/kaikai_sk/article/details/79177036 PS:为什么Linux系统没运行多少程序,显示的可用内存这么少?其实Linux与W ...

  5. Python编程-多进程一

    一.python并发编程之多进程 1.multiprocessing模块介绍 python中的多线程无法利用多核优势,如果想要充分地使用多核CPU的资源(os.cpu_count()查看),在pyth ...

  6. JavaWeb Session

    1. Session概述 1.1. 什么是Session Session一般译为会话,是解决Http协议的无状态问题的方案,可以将一次会话中的数据存储在服务器端的内存中,保证在下一次的会话中可以使用. ...

  7. iOS_SDWebImage框架分析

    SDWebImage 支持异步的图片下载+缓存,提供了 UIImageView+WebCacha 的 category,方便使用.使用SDWebImage首先了解它加载图片的流程. 入口 setIma ...

  8. groupby和agg的使用

    先来看一段代码: 分析下groupby和agg的联合使用: reset_index()表示重新设置索引 agg传进来的统计特征: 按照A这一列作聚合,C这一列作统计 注意:df = df.groupb ...

  9. Python 时间日历类型

    # 时间日历 # time模块 # 提供了处理时间和表示之间转换的功能 # 获取当前时间戳 # 概念 # 从0时区的1970年1月1日0时0分0秒, 到所给定日期时间的秒数 # 浮点数 # 获取方式 ...

  10. mvn库

    http://maven.aliyun.com/nexus/content/groups/public/ http://mvnrepository.com/http://search.maven.or ...