props: {
homeData: {
type: Object,
required: true
}
},
父组件传递给子组件是对象homeData或者数组: homeData={name:'zs',list:[1,2,3]} name list都是vue 响应式的
子组件的props去接收homeData 是可以在页面中直接使用homeData对象里面属性值的 homeData.name homeData.list
也包括子组件里面的method/computed 访问到的name  list 都是实时更新的
并且,父组件或子组件如果去修改homeData里面的name/list,父组件和子组件都是同时改变。因为引用是同一份数据。
缺点是:子组件可以直接修改父组件的值。可能带来隐藏问题
如果不想子组件去修改父组件homeData里面的name list。就需要把name list 赋值到子组件的data里面,作为初始化值使用
以后就使用子组件定义的name list,但是如果父组件homeData里面的name list发生改变,子组件的data里面name list不会同时改变,
如果想产生联系,就需要在子组件的watch属性去监视homeData的name/list ,虽然子组件的props里面定义的是homeData,
但是确实可以监视的到homeData.list /homeData.name的属性值变化。
这样的效果是:父组件的值改变子组件也会同步修改。并且子组件的值发生改变,是不会引起父组件值变化。
缺点是:增加了很多重复逻辑和代码量
 
 结论是:改变传过来对象属性,父组件同步更改。并且watch设置深度监听是有效的
      直接增加传过来对象的属性,props数据子组件和父组件都会新加,但不是响应式,页面不会有任何变化
      并且 设置watch深度监听也是无效的
      如果设置新加属性也是响应式,必须使用Vue.set或者this.$set方法
 

13props 对象的更多相关文章

  1. 如何一步一步用DDD设计一个电商网站(九)—— 小心陷入值对象持久化的坑

    阅读目录 前言 场景1的思考 场景2的思考 避坑方式 实践 结语 一.前言 在上一篇中(如何一步一步用DDD设计一个电商网站(八)—— 会员价的集成),有一行注释的代码: public interfa ...

  2. javascript中的Array对象 —— 数组的合并、转换、迭代、排序、堆栈

    Array 是javascript中经常用到的数据类型.javascript 的数组其他语言中数组的最大的区别是其每个数组项都可以保存任何类型的数据.本文主要讨论javascript中数组的声明.转换 ...

  3. 探究javascript对象和数组的异同,及函数变量缓存技巧

    javascript中最经典也最受非议的一句话就是:javascript中一切皆是对象.这篇重点要提到的,就是任何jser都不陌生的Object和Array. 有段时间曾经很诧异,到底两种数据类型用来 ...

  4. Asp.Net WebApi核心对象解析(下篇)

    在接着写Asp.Net WebApi核心对象解析(下篇)之前,还是一如既往的扯扯淡,元旦刚过,整个人还是处于晕的状态,一大早就来处理系统BUG,简直是坑爹(好在没让我元旦赶过来该BUG),队友挖的坑, ...

  5. JS核心系列:浅谈原型对象和原型链

    在Javascript中,万物皆对象,但对象也有区别,大致可以分为两类,即:普通对象(Object)和函数对象(Function). 一般而言,通过new Function产生的对象是函数对象,其他对 ...

  6. Chrome出了个小bug:论如何在Chrome下劫持原生只读对象

    Chrome出了个小bug:论如何在Chrome下劫持原生只读对象 概述 众所周知,虽然JavaScript是个很灵活的语言,浏览器里很多原生的方法都可以随意覆盖或者重写,比如alert.但是为了保证 ...

  7. XStream将java对象转换为xml时,对象字段中的下划线“_”,转换后变成了两个的解决办法

            在前几天的一个项目中,由于数据库字段的命名原因 其中有两项:一项叫做"市场价格"一项叫做"商店价格" 为了便于区分,遂分别将其命名为market ...

  8. ASP.NET内置对象的总结

    1. Response对象可形象的称之为响应对象,用于将数据从服务器发送回浏览器. 实例源码:链接: http://pan.baidu.com/s/1dDCKQ8x 密码: ihq0  2. Requ ...

  9. ADO.NET对象的详解

    1. Connection 类 和数据库交互,必须连接它.连接帮助指明数据库服务器.数据库名字.用户名.密码,和连接数据库所需要的其它参数.Connection对象会被Command对象使用,这样就能 ...

随机推荐

  1. synchronized 锁的原理

    synchronized 的基本认识 在多线程并发编程中 synchronized 一直是元老级角色,很 多人都会称呼它为重量级锁.但是,随着 Java SE 1.6 对 synchronized 进 ...

  2. 20行Python代码检测人脸是否佩戴口罩

    最近,口罩成为绝对热门的话题,在疫情之下,出门不戴口罩不仅对自己不负责,对他人而言也是一种潜在的威胁.所以许多小区都有保安在门口守着,谁要是不戴口罩就吼回去(吓死我了). 很多人学习python,不知 ...

  3. Python 5 行代码的神奇操作

    Python 语言实现功能直接了当,简明扼要,今天咱们就来一起看看 Python 5 行代码的神奇操作! 1.古典兔子问题 很多人学习python,不知道从何学起.很多人学习python,掌握了基本语 ...

  4. 微博AnalysisQl动态数据视图元数据设计

    前言 目前,AnalysisQl 数据视图的元数据(维度.指标.指标计算器)需要通过代码(API)或资源文件的形式硬编码,应用启动时,按照声明的顺序依次注册.这种模式下,数据视图是 静态 的,任何一项 ...

  5. C#图解教程(第四版)—03—类和继承

    1 使用基类的引用 派生类的实例由  基类的实例   加上  派生类 新增的成员 组成. 派生类的  引用   指向整个类对象,包括基类部分 重点:使用对象的  基类部分的引用  来访问对象   (父 ...

  6. idea的热加载与热部署

    一:热加载与热部署     热部署的意思就是不用手动重启环境,修改类后,项目会自动重启.但是如果项目比较大,重启也需要耗时十几秒左右.     热加载意为不需要重新启动,修改了什么文件就重新加载什么文 ...

  7. Mybatis 和 Solon 在一起的升级版

    终于说通 Solon 作者,让他为 Solon 框架添加事务注解支持了:并且把 mybatis-solon-plugin 的 @Df 注解更名为 @Db ,接地气多了(Df是什么鬼呢?新手肯定这么想. ...

  8. linux root用户下没有.ssh目录

    .ssh 是记录密码信息的文件夹,如果没有登录过root的话,就没有 .ssh 文件夹,因此登录 localhost ,并输入密码就会生成了 ssh localhost

  9. java 二分查找的注意事项

    二分查找也是最简单的算法之一了.但是最近发现一般的写法会有问题. public int search(int[] nums, int target) { int left = 0; int right ...

  10. Docker商业版受限,胖容器是个选择

    前情概要 8月13日,Docker 公司更新了网站服务协议,条款申明,禁止禁运国家和被列入「美国实体清单」的组织和个人使用带有该服务协议链接的 Docker 网站和所有相关网站.这一更新协议迅速引起了 ...