Vue 入门级学习笔记 实例

创建一个Vue实例

		var vm = new Vue({
			//选项对象
		});

一个Vue应用通过一个由new Vue创建的根Vue实例和可选的嵌套的,可复用的组件树组成

所有的Vue组件都是Vue实例,并接受相同的选项对象(一些根实例特有的选项除外)

 

数据与方法

		var origin = {
			a: 1
		}
		var vm = new Vue({
			//选项对象
			data: origin
		});
		vm.a; //1
		vm.$data == origin; //true

可以直接在data中定义新对象,本例中引用对象只是为了方便说明

可以直接通过vm.a的方式来访问vm中data中的a属性

这是因为vue重写了对应属性的访问描述符getter和setter等

只有当实例被创建时data中存在的属性才是响应式的(响应式的属性值发生改变时,视图将会产生响应,即匹配更新为最新的值)

也就是说添加了新的属性并不是响应式

解决方式:占位属性,使用value为空值('',0,false,[],null等)

		var vm = new Vue({
			//选项对象
			data: {
				a:null,
				b:"",
				c:[]
			}
		});

这里唯一例外的是使用Object.freeze()

(Object.freeze()会调用Object.preventExtensions(..)来禁止添加新属性并把所有属性标记为confi