Vue.js学习日记(1)——Vue实例

1.什么是Vue.js？

　　Vue.js是一套用于构建用户界面的渐进式框架，其核心是一个允许采用简洁的模板语法来声明式地将数据渲染进 DOM 的响应式系统。

　　关键词：渐进式，声明式，响应式，数据渲染

2.创建一个Vue实例

　　一个Vue组件实质上就是一个Vue实例，每个Vue应用都是通过Vue函数创建一个新的Vue实例开始的：

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

　　当创建一个Vue实例时，可以传入一个选项对象。

3.实例的数据与方法

        当一个Vue实例被创建时，它向Vue的响应式系统中加入了其data对象中能找到的所有的属性。当这些属性的值发生改变时，视图将会产生“响应”，即匹配更新为新的值。当这些数据改变时，视图会进行重渲染。

 当实例被创建时,只有data中存在的属性才是响应式的，比如

vm.b = 'hi'

那么对b的改动将不会触发任何视图的更新。

通过使用Object.freeze()，以阻止修改现有属性，也意味着响应系统无法再追踪变化

var obj = {
  name: 'Tom'  
};

Object.freeze(obj);

var vm = new Vue({
  el: '#app',
  data: obj
});

<div id="app">
    <!-- 这里的 'name' 不会更新! -->
　　{{ name }}
</div>

Vue实例的实例属性与方法。他们都有前缀$，以便与用户定义的属性区分开来。

var data = { a: 1 }
var vm = new Vue({
  el: '#example',
  data: data
})

vm.$data === data // => true
vm.$el === document.getElementById('example') // => true