- 说明
每个 Vue 应用都需要通过实例化 Vue 来实现。
例子如下：import Vue from "vue"; var MainCtrl=new Vue({ ... });
-
new Vue({})中参数对象属性解析
el
el是CSS 选择器，用于查询元素的
如el:"#main" 或 el:".test"
data
data用于定义属性，其实就是和html，进行数据绑定的变量
如data:{ message:"123" },<h3>{{message}}</h3>
methods
用于定义函数，可以在界面上调用函数返回值，是输出数据，
并不是数据绑定methods:{ details: function () { return `${this.message}:test`; } }<h1>{{details()}}</h1>
- 关于数据绑定
当一个
Vue实例被创建的时候，即new Vue({})，它向Vue的响应式系统中加入其data对象中能找到的所有属性。当这些属性的值发生变化时，html视图也会发生变化。也就是说，数据绑定是针对data的。
- 关于
data对象属性引用问题
如下：
var data={ messagea:"123" }; var vue=new Vue({ el:"#main", data:data, methods:{ details: function () { return `${this.messagea}:test`; } } });
发现vue.messagea===data.messagea，说明vue对象获取了data对象属性的引用
vue：设置属性也会影响到原始数据
-
vue对象获取data对象
vue.$data
-
vue对象获取DOM元素
vue.$el === document.getElementById('main')
