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

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

其实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. Android系统移植与调试之------->如何修改Android手机显示的4G信号强度的格子数

    在修改显示的信号强度之前,先了解一下什么是dB,什么是dBm? 1.dB dB是一个表征相对值的值,纯粹的比值,只表示两个量的相对大小关系,没有单位,当考虑甲的功率相比于乙功率大或小多少个dB时, 按 ...

  2. Log Explorer 恢复误删除、更新数据

    一.介绍 详细参考:https://blog.csdn.net/jinjazz/article/details/2459692 转自:https://blog.csdn.net/hch27151099 ...

  3. 002-JVM运行时数据区【内存模型】

    一.概述 JVM定义了不同运行时数据区,他们是用来执行应用程序的.某些区域随着JVM启动及销毁,另外一些区域的数据是线程性独立的,随着线程创建和销毁. 1.1.jvm自身物理结构 1.2.java内存 ...

  4. gradle build 找不到tools.jar 解决方法

    import javax.tools.ToolProvider compile(files(((URLClassLoader) ToolProvider.getSystemToolClassLoade ...

  5. php会话技术之Session用法

    php会话技术之Session用法举例. 本文原始链接:http://www.jbxue.com/article/8940.html1.创建session <?php     //创建sessi ...

  6. Linux常用的指令(...编辑文件+保存)

    mkdir命令用来创建目录 1 mkdir filename touch命令有两个功能:一是用于把已存在文件的时间标签更新为系统当前的时间(默认方式),它们的数据将原封不动地保留下来:二是用来创建新的 ...

  7. java中类名.class, class.forName(), getClass()区别

    Class对象的生成方式如下: 1.类名.class           说明: JVM将使用类装载器, 将类装入内存(前提是:类还没有装入内存),不做类的初始化工作.返回Class的对象 2.Cla ...

  8. GP DBA基本操作

    1.查看队列情况 SELECT * FROM gp_toolkit.gp_resqueue_status; 如果出现了资源占用大于1.1 e+11SQL,则可能存在不合理执行计划的SQL, 基本跑不出 ...

  9. python之json模块的基本使用

    json模块的作用:将字符串和字典相互转换 json和eval的区别: eval函数不能识别null转换成None json可以将null转换成python可以识别的None json序列化和反序列化 ...

  10. windows环境下安装部署并启用zkui的web图形界面

    在此之前的工作:不是本机部署的三个服务器最为伪集群的zookeeper环境,并将三个为服务启动起来. 然后才有了下面的工作. 1. 首先,zkui项目地址:https://github.com/Dee ...