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

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

其实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. PAT 1073 多选题常见计分法 （20 分）

    批改多选题是比较麻烦的事情,有很多不同的计分方法.有一种最常见的计分方法是:如果考生选择了部分正确选项,并且没有选择任何错误选项,则得到 50% 分数:如果考生选择了任何一个错误的选项,则不能得分.本 ...

  2. Spring 单例

    我们知道 Web 容器本身就是多线程的,Web 容器为一个 Http 请求创建一个独立的线程,所以由此请求所牵涉到的 Spring 容器中的 Bean 也是运行于多线程的环境下.在绝大多数情况下,Sp ...

  3. Java转C#，非常不错（转）

    http://www.cnblogs.com/cnwebman/archive/2012/07/21/2602436.html 最近正在研究将一个纯java工程如何转换成C#工程,代码量还比较大,于是 ...

  4. Apache Shiro:【1】Shiro基础及Web集成

    Apache Shiro:[1]Shiro基础及Web集成 Apache Shiro是什么 Apache Shiro是一个强大且易于使用的Java安全框架,提供了认证.授权.加密.会话管理,与spri ...

  5. Linux查看某个端口+gcc动态编译

    Linux下就: 1.lsof -i:端口号 2.netstat -tunlp|grep 端口号 gcc:动态编译 gcc –fpic –c file.c –o file.o gcc –shared ...

  6. PHP 数字转大写

    <?php header("content-type:text/html;charset=utf-8"); function numToRmb($num){ $rmbNum ...

  7. imx6solo wm8960始终没有声音输出

    我尝试各种办法,wm8960始终不能得到声音输出.调试过程如下: 首先,打开电源使能脚: ret=gpio_request(SABRESD_CODEC_PWR_EN,"audio_pwr_e ...

  8. QtGstreamer 编译

    一  安装依赖项 1 安装cmake hdhuang@hdh-UBT:~/gstreamer/qt-gstreamer-0.10.2/build$ sudo apt-get install cmake ...

  9. 数字代币ICO

    随着比特币.莱特币.以太币的逐步兴起,越来越多的数字代币开始衍生,虚拟货币扑朔迷离,一不小心就被人割了韭菜..... 从荷兰IPO的故事说起 400多年前,西方有一群精英海盗开了一家公司.为了顺利拓展 ...

  10. JavaWeb CSS

    1. CSS介绍 1.1. 什么是CSS CSS全称为Cascading Style Sheets,译为层叠样式表. 样式定义如何显示HTML元素. 样式通常存储在样式表中. 1.2. 百度百科 CS ...