Vue构造选项（一）

创建Vue实例

内存图

把Vue的实例命名为vm是尤雨溪的习惯，我们应该沿用

vm对象封装了对视图的所有操作，包括数据读写、事件绑定、DOM更新

vm的构造函数是Vue，按照ES6的说法，vm所属的类是Vue

options是new Vue的参数，一般称之为选项或构造选项

一、options里面有什么

Vue文档

• 英文文档里面搜options，中文文档里面搜选项，即可得到相关文档

options的五类属性

• 数据：data、props、propsData、computed、methods、watch
• DOM：el、template、render、renderError
• 生命周期钩子：beforecreated、beforeMount、mounted、beforeUpdate、updated、activated、deactivated、beforeDestroy、destroyed、errorCaptured
• 资源：directives、filters、components
• 组合：parent、mixins、extends、provide/inject
• 其他：name、delimiters、functional、model、inheritAttrs、comments

入门属性

el - 挂载点

• 可用 $mount 代替

data - 内部数据

• 支持对象和函数，优先用函数

methods - 方法

• 事件处理函数或者是普通函数

components

• Vue组件，注意大小写
• 有三种引入方式
  • import引入vue文件，在new Vue实例中components应用
  • 在同一个文件中使用Vue.component定义，全局的可以任意使用
  • 将前两种方式结合起来用

四个钩子

• created - 实例出现在内存中
• mounted - 实例出现在页面中
• updated - 实例更新了
• destroyed - 实例从页面和内存中消亡

props - 外部数据

• 也叫属性
• message = “n” 传入字符串
• :message = “n” 传入this.n数据
• :fn=“add” 传入this.add 函数