1 代码

<body>

   <div id="root">

    <h1>{{name}}</h1>

    <h1>{{obj}}</h1>

   </div>

   <script type="text/javascript" >

    let a = {

        name:'sisi'

    }

    const vm = new Vue({

        el:'#root',

        data:{

            name:a.name,

            obj:a

        }

    })

    </script>

</body>

2 页面

3 vm外层属性 _data属性 及vm外部变量

　　1）vm外层属性和_data属性的关系

　　　　可以看到vm外层的属性和_data里面的属性是相等的，因为外层的属性就是代理的_data的属性

　　2)_data属性的值使用的是vm以外的对象的话

　　　　值是一般数据类型：初始化的时候把值赋值给_data的属性了，后面两者可以说没有关系了

　　　　值是对象：初始化的时候把对象地址赋值给_data的属性了

4 测试1

　　初始化的时候，值全部是'sisi'

　　

　　执行命令a.name='数学'

　　 结果：

　　　　a对象的name属性变化了

　　　　vm._data.obj.name 变化了，vm.obj.name变化了

　　　　vm.name没变化，vm._data.name没变化

5 测试2

　　刷新页面，初始化的时候，值全部是'sisi'

　　

　　执行命令vm.name='历史'

　　结果：

　　　　vm.name变化，vm._data.name变化

　　　　vm._data.obj.name 没变，vm.obj.name没变

　　　　a对象的name属性没变

　　

6 测试3

　　刷新页面，初始化的时候，值全部是'sisi'

　　

　　执行命令vm.obj.name='化学'

　　结果：

　　　　vm._data.obj.name 变了，vm.obj.name变了

　　　　a对象的name属性变了

　　　　vm.name没变，vm._data.name没变

Vue11 vue的data中属性的值(基础数据类型和对象)的更多相关文章

  1. vue 需求 data中的数据之间的调用

    我遇到过这种情况  就是在我的data中 会有数据调用data中的其他数据 如图  我的alertInfoType需要拿到screeningCondition中type的值 用过vue的都知道 我是不 ...

  2. [ArcGIS API for JavaScript 4.8] Sample Code-Popups-1-popupTemplate的概念和popup中属性字段值的多种表现形式

    [官方文档:https://developers.arcgis.com/javascript/latest/sample-code/intro-popuptemplate/index.html] 一. ...

  3. Python 类中__init__()方法中的形参与如何修改类中属性的值

    一.__init__()方法 如果__init__()方法为 class Cat(): def __init__(self,num) : self.num=num Python中类的__init__( ...

  4. java：Hibernate框架1（环境搭建，Hibernate.cfg.xml中属性含义，Hibernate常用API对象，HibernteUitl，对象生命周期图，数据对象的三种状态，增删查改）

    1.环境搭建: 三个准备+7个步骤 准备1:新建项目并添加hibernate依赖的jar文件  准备2:在classpath下(src目录下)新建hibernate的配置文件:hibernate.cf ...

  5. 在checkbox中使用.prop; angular中属性的值使用变量问题

    1.在checkbox中使用.prop而不使用.attr ,.attr有时并不如愿的改变checkbox的打钩问题 给这个checkbox设置return  false就能阻止点击则改变状态的默认行为 ...

  6. vue之store中属性更新用法

    //1.首先定义store对象下的属性 state: { data:'测试数据' } // 2.定义更改data数据的方法 mutations: { updatedata(state, p) { st ...

  7. react中属性默认值是true?

    看到项目代码中 return ( <MyWebView state="Login" title="登录app" ref="login" ...

  8. vue 初始化data中的数据

    Object.assign(this.$data, this.$options.data());

  9. C# 获取类中属性注释值

    转 http://bbs.csdn.net/topics/350019800 PropertyInfo[] peroperties = typeof(TEST).GetProperties(Bindi ...

  10. vue 重置data中表单form的值 重置变量

    export default { data() { return { form:{ name:"张三", age:13, sex:1, address:"" } ...

随机推荐

  1. C#自定义控件开发（1）

    自定义控件可以用组件或者用户控件来开发,如果是基于基础控件,进行一些扩展,那么可以使用组件,其它的情况可以使用用户控件. 首先新建一个类库项目,然后添加一个组件,取名为ButtonExtend,再添加 ...

  2. 视频服务HDR Vivid 还原色彩，让所见成“真”

    如今,视频正在以一种前所未有的方式渗入日常生活,是当下人们记录生活最热门的方式.所以,用户对视频的画质要求越来越高,App想要吸引更多的用户,拥有视频画质新技术的强力支撑很关键. HDR(High-D ...

  3. 对于函数极限存在的充要条件“lim f(x)=A互推f(x)=A+a(x) lim a(x)=0”补充解释

    毫无疑问,这个定义适用于任何函数极限,诺f(x)有去间断点的时候,a(x)也为可去间断点函数. 例:

  4. PDF、视频格式缩略图获取(pdf2img)

    PDF.视频格式缩略图获取(pdf2img) 获取pdf缩略图 导入依赖: <dependency> <groupId>org.apache.pdfbox</groupI ...

  5. CyclicBarrier循环屏障源码解析(基于jdk11)

    目录 CyclicBarrier循环屏障源码解析(基于jdk11) 1.1 CyclicBarrier概述 1.2 CyclicBarrier原理 1.2.1 基本结构(jdk11) 1.2.2 aw ...

  6. 基于训练和推理场景下的MindStudio高精度对比

    摘要:MindStudio提供精度比对功能,支持Vector比对能力. 本文分享自华为云社区<[MindStudio训练营第一季]MindStudio 高精度对比随笔>,作者:Tianyi ...

  7. this关键字在JAVA和JS中的异同

    this在JS中的用法 由于js中this 是在运行期进行绑定的,所以js中的 this 可以是全局对象.当前对象或者任意对象,这完全取决于函数的调用方式.JavaScript 中函数的调用有以下几种 ...

  8. go-carbon 1.5.3 版本发布， 修复已知 bug 和新增俄罗斯语翻译文件

    carbon 是一个轻量级.语义化.对开发者友好的golang时间处理库,支持链式调用. 目前已被 awesome-go 收录,如果您觉得不错,请给个star吧 github.com/golang-m ...

  9. MongoDB安全加固，防止数据库攻击删除勒索威胁

    前言: 今天发现前段时间自己搭建的一个系统的MongoDB数据找不到了,觉得很奇妙,然后登上MongoDB数据库发现多了一个名为READ__ME_TO_RECOVER_YOUR_DATA的数据库,里面 ...

  10. 【JVM】经典垃圾回收器

    本文已收录至Github,推荐阅读 Java随想录 微信公众号:Java随想录 CSDN: 码农BookSea 转载请在文首注明出处,如发现恶意抄袭/搬运,会动用法律武器维护自己的权益.让我们一起维护 ...