这俩天看了下 Vue 简单学习了下，官方文档讲的很详细，但是太详细的东西反而显得不是那么容易查找及对比学习，于是自己整理了下主要知识点。以下所有内容均是基于 Vue 2.x 版本整理的，望知悉！

全局配置

名称 类型 默认值 详细
silent boolean false 取消Vue所有的日志与警告
optionMergeStrategies {[key:string]:Function} {} 自定义合并策略的选项
devtools boolean true/false（生产） 配置是否允许vue-devtools检查代码
errorHandler Function undefined 指定组件的渲染和观察期间未捕获错误的处理函数
warnHandler Function undefined 为Vue的运行时警告赋予一个自定义处理函数，仅开发环境生效
ignoredElements Array<string | RegExp> [] 须使Vue忽略在Vue之外的自定义元素，否则抛出Unknown custom element 的警告
keyCodes {[key:string]:number|Array<number>} {} 给v-on自定义键位别名
performance boolean false 设置为 true 以在浏览器开发工具的性能/时间线面板中启用对组件初始化、编译、渲染和打补丁的性能追踪。只适用于开发模式和支持 performance.mark API 的浏览器上
productionTip boolean true 设置为false以阻止Vue在启动时生成生产提示

全局API

名称 参数 详细
Vue.extend(options) {Object}options 使用基础 Vue 构造器，创建一个“子类”。参数是一个包含组件选项的对象。data 选项是特例，需要注意 – 在 Vue.extend() 中它必须是函数
Vue.nextTick([callback,context]) {Function}[callback]
{Object}[context]		 在下次DOM更新循环结束之后执行延迟回调。在修改数据之后立即使用这个方法，获取更新后的DOM
Vue.set（target，propertyName/index,value) {Object|Arry}target
{String|Number}propertyName/index
{any}value		 向响应式对象中添加一个property，并确保这个新property同样是响应式的，且触发视图更新。它必须用于向响应式对象上添加新property，因为Vue无法探测普通的新增property。
注意对象不能是Vue实例，或者Vue实例的根数据对象
Vue.delete（target,propertyName/index) {Object|Arry}target
{String|Number}propertyName/index		 删除对象的property。如果对象是响应式的，确保删除能触发更新视图。这个方法主要用于避开Vue不能检测到property被删除的限制。
注意对象不能是Vue实例，或者Vue实例的根数据对象
Vue.directive(id,[definition]) {String}id
{Function|Object}[definition]		 注册或获取全局指令
Vue.filter(id,[definition]) {String}id
{Function}[definition]		 注册或获取全局过滤器
Vue.component(id,[definition]) {String}id
{Function|Object}[definition]		 注册或获取全局组件。注册还会自动使用给定的 id 设置组件名称
Vue.use(plugin) {Object|Function}plugin 安装Vue.js插件。该方法需要在调用 new Vue() 之前被调用。
Vue.mixin(mixin) {Object}mixin 全局注册一个混入，影响注册之后所有创建的每个 Vue 实例
Vue.compile(template) {String}template 将一个模板字符串编译成render函数
Vue.observable(object) {Object}object 让一个对象可响应。Vue 内部会用它来处理 data 函数返回的对象
Vue.version 提供字符串形式的Vue安装版本号

选项-数据

名称 类型 详细
data Object|Function Vue实例的数据对象。组件的定义只接受Function
props Array<String>|Object 数组或对象，用于接收来自父组件的数据。
基于对象的选项：type、default、required、validator
propsData {[key:String]:any} 创建实例时传递props，主要方便测试。只用于 new 创建的实例中
computed {[key:String]:Function|{get:Function,set:Function}} 计算属性将被混入到Vue实例中。所有 getter 和 setter 的 this 上下文自动地绑定为 Vue 实例。
methods {[key:String]:Function} methods将被混入到Vue实例中。可以直接通过VM实例访问这些方法，或者在指令表达式中使用。方法中的 this 自动绑定 Vue 实例
watch {[key:String]:String|Function|Object|Array} 一个对象，键是需要观察的表达式，值是对应回调函数、方法名或对象。Vue 实例将会在实例化时调用 $watch()，遍历 watch 对象的每一个 property。

选项-DOM

名称 类型 详细
el String|Element 提供一个在页面上已存在的DOM元素作为Vue实例的关注目标。可以是 CSS 选择器或HTMLElement实例。只在用 new 创建实例时生效
template String 一个字符串模板作为Vue实例的标识使用。模板将会替换挂载元素。挂载元素的内容都将被忽略，除非模板的内容有分发插槽。
render (createElement:()=>VNode)=>VNode 字符串模板的替代方案，允许你发挥JavaScript最大编程能力。该渲染函数接收一个createElement方法作为第一个参数用来创建Vnode。
如果组件是一个函数组件，渲染函数还会接收一个额外的 context 参数，为没有实例的函数组件提供上下文信息。
renderError (createElement:()=>Vnode,error:Error)=>VNode 当 render 函数遭遇错误是，提供另外一种渲染输出。其错误将会作为第二个参数传递到renderError。仅在开发环境下工作

选项-生命周期钩子

名称 类型 详细
beforeCreate Function 实例初始化之后，数据观测和event/watcher时间配置前调用
created Function 实例创建完成后被立即调用
beforeMount Function 挂载开始之前被调用：相关的render函数首次被调用，服务器端渲染期间不被调用
mounted Function 实例别挂载后调用，服务器端渲染期间不被调用
beforeUpdate Function 数据更新时调用，发生在虚拟DOM打补丁之前。服务器端渲染期间不被调用
updated Function 数据更新导致虚拟DOM重新渲染和打补丁之后调用。服务器端渲染期间不被调用
activated Function 被keep-alive缓存的组件激活时调用。服务器端渲染期间不被调用
deactivated Function 被keep-alive缓存的组件停用时调用。服务器端渲染期间不被调用
beforeDestroy Function 实例销毁之前调用。在这一步，实例仍然完全可用。服务器端渲染期间不被调用
destroyed Function 实例销毁之后调用。服务器端渲染期间不被调用
errorCaptured (err:Error,vm:Component,info:String)=>?boolean 当捕获一个来自子孙组件的错误时被调用

选项-资源

名称 类型 详细
directives Object 包含Vue实例可用指令的哈希表
filters Object 包含Vue实例可用过滤器的哈希表
components Object 包含Vue实例可用组件的哈希表

选项-组合

名称 类型 详细
parent Vue instance 指定已创建的实例之父实例，在两者之间建立父子关系
mixins Array<Object> 接收一个混入对象的数组，这些混入对象可以像正常的实例对象一样包含实例选项，这些选项将会被合并到最终的选项中，使用的是和 Vue.extend() 一样的选项合并逻辑。也就是说，如果你的混入包含一个 created 钩子，而创建组件本身也有一个，那么两个函数都会被调用。
Mixin 钩子按照传入顺序依次调用，并在调用组件自身的钩子之前被调用。
extends Object|Function 允许声明扩展另一个组件，而无需使用 Vue.extend。主要方便扩展单文件组件
provide/inject provide:Object|() =>Object
inject:Array<string>|{ [key: String]:String|Symbol|Object}		 provide 和 inject 主要在开发高阶插件/组件库时使用。并不推荐用于普通应用程序代码中。
这对选项需要一起使用，以允许一个祖先组件向其所有子孙后代注入一个依赖，不论组件层次有多深，并在起上下游关系成立的时间里始终生效。

选项-其它

名称 类型 详细
name String 允许组件模板递归地调用自身。只有作为组件选项时起作用
delimiters Array<String> 改变纯文本插入分隔符。默认值：[“{{“, “}}”]
functional Boolean 使组件无状态和无实例。他们用一个简单的render函数返回虚拟节点使它们渲染的代价更小
model {prop?:String,event?:String} 允许一个自定义组件在使用v-model时定制prop和event
inheritAttrs Boolean 默认情况下父作用域的不被认作props的attribute绑定将会“回退”且作为普通的HTML attribute 应用在子组件的根元素上。当撰写包裹一个目标元素或另一个组件的组件时，这可能不会总是符合预期行为。通过设置 inheritAttrs为false，这些默认行为将会被去掉。
comments Boolean 当设为true时将会保留且渲染模板中的HTML注释，默认为false

实例Property

名称 类型 详细
vm.$data Object Vue实例观察的数据对象。Vue实例代理了对其data对象property的访问
vm.$props Object 当前组件接收到的props对象。Vue实例代理了对其data对象property的访问
vm.$el Element Vue实例用的根DOM元素
vm.$options Object 用于当前Vue实例的初始化选项
vm.$parent Vue instance 父实例，如果当前实例有的话
vm.$root Vue instance 当前组件树的根Vue实例。如果当前实例没有父实例，此实例将会是自己
vm.$children Array<Vue instance> 当前实例的直接子组件。$children并不保证顺序，也不是响应式的
vm.$slots {[name:String]:?Array<VNode>} 用来访问被插槽分发的内容。每个具名插槽都有其相应的Property
vm.$scopedSlots {[name:String]:props=>Array<Vnode>|undefined} 用来访问作用域插槽。对于包含默认slot在内的每一个插槽，该对象都包含一个返回相应VNode的函数
vm.$refs Object 一个对象，持有注册过ref attribute的所有DOM元素和组件实例
vm.$isServer Boolean 当前Vue实例是否运行于服务器
vm.$attrs {[key:String]:String} 包含了父作用域中不作为prop被识别的attribute绑定
vm.$listeners {[key:String]:Function|Array<Function>} 包含了父作用域中的v-on事件监听器

实例方法-数据

名称 参数 详细
vm.$watch(expOrFn,callback,[options]) {String|Function}expOrFn
{Function|Object}callback
{Object}[options]		 观察 Vue 实例上的一个表达式或者一个函数计算结果的变化。回调函数得到的参数为新值和旧值。表达式只接受监督的键路径。对于更复杂的表达式，用一个函数取代。
vm.$set(target, propertyName/index, value) {Object|Array}target
{String|Number}propertyName/index
{any}value		 这是全局Vue.set的别名
vm.$delete(target, propertyName/index) {Object|Array}target
{String|Number}propertyName/index		 这是全局Vue.delete的别名

实例方法-事件

名称 参数 详细
vm.$on(event,callback) {String|Array<String>}event)
{Function}callback		 监听当前实例上的自定义事件。事件可由vm.$emit触发。回调函数会接收所有传入事件触发函数的额外参数
vm.$once(event,callback) {String}event
{Function}callback		 监听一个自定义事件，但是只触发一次。一旦触发之后，监听器就会被移除
vm.$off([event,callback]) {string|Array<string>}event
{Function}[callback]		 移除自定义事件监听器。
如果没有提供参数，则移除所有的事件监听器；
如果只提供了事件，则移除该事件所有的监听器；
如果同时提供了事件与回调，则只移除这个回调的监听器
vm.$emit(eventName,[…args]) {String}eventName
[…args]		 触发当前实例上的事件。附加参数都会传给监听器回调

实例方法-生命周期

名称 参数 详细
vm.$mount([elementOrSelector]) {Element|string}[elementOrSelector]
{boolean}[hydrating]		 如果 Vue 实例在实例化时没有收到 el 选项，则它处于“未挂载”状态，没有关联的 DOM 元素。可以使用 vm.$mount() 手动地挂载一个未挂载的实例。
如果没有提供 elementOrSelector 参数，模板将被渲染为文档之外的的元素，并且你必须使用原生 DOM API 把它插入文档中。
这个方法返回实例自身，因而可以链式调用其它实例方法
vm.$forceUpdate() 迫使 Vue 实例重新渲染。注意它仅仅影响实例本身和插入插槽内容的子组件，而不是所有子组件
vm.$nextTick([callback]) {Function}[callback] 将回调延迟到下次 DOM 更新循环之后执行。在修改数据之后立即使用它，然后等待 DOM 更新
vm.$destroy() 完全销毁一个实例。清理它与其它实例的连接，解绑它的全部指令及事件监听器

指令

名称 类型 详细
v-text String 更新元素的textContent
v-html String 更新元素的innerHTML
v-show Any 根据表达式真假，切换元素的display
v-if Any 根据表达式的值来有条件地渲染元素。在切换时元素及它的数据绑定 / 组件被销毁并重建
v-else 为v-if或者v-else-if添加else块
v-else-if Any 表示v-if的else if块
v-for Array|Object|Number|String|Iterable 基于源数据多次渲染元素或模板块。特定语法alias in expression
v-on Funtion|Inline Statement|Object 绑定事件监听器，事件类型由参数指定
v-bind Any(with argument)|Object(without argument) 动态地绑定一个或多个attribute，或一个组件prop到表达式
v-model 在表单控件或者组件上创建双向绑定
v-slot 提供具名插槽或需要接收prop的插槽
v-pre 跳过这个元素和他的子元素编译过程。可以用来显示原始Mustache标签
v-cloak 这个指令保持在元素上直到关联实例结束编译。和 CSS 规则如 [v-cloak] { display: none } 一起用时，这个指令可以隐藏未编译的 Mustache 标签直到实例准备完毕。
v-once 只渲染元素和组件一次。随后的重新渲染，元素/组件及其所有的子节点将被视为静态内容并跳过

特殊attribute

名称 类型 详细
key Number|String key主要用在 Vue 的虚拟 DOM 算法，使用 key 时，它会基于 key 的变化重新排列元素顺序，并且会移除 key 不存在的元素。
ref String ref 被用来给元素或子组件注册引用信息
is String|Object 用于动态组件且基于 DOM 内模板的限制来工作
slot 用于标记往哪个具名插槽中插入子组件内容,已废弃！
slot-scope 用于将元素或组件表示为作用域插槽，已废弃！
scope 用于表示一个作为带作用域的插槽的 <template> 元素，已移除！

内置的组件

名称 详细
component 渲染一个“元组件”为动态组件。依 is 的值，来决定哪个组件被渲染。
transition <transition> 元素作为单个元素/组件的过渡效果。<transition> 只会把过渡效果应用到其包裹的内容上，而不会额外渲染 DOM 元素，也不会出现在可被检查的组件层级中。
transition-group <transition-group> 元素作为多个元素/组件的过渡效果。<transition-group> 渲染一个真实的 DOM 元素。默认渲染 <span>，可以通过 tag attribute 配置哪个元素应该被渲染。
keep-alive <keep-alive> 包裹动态组件时，会缓存不活动的组件实例，而不是销毁它们。和 <transition> 相似，<keep-alive> 是一个抽象组件：它自身不会渲染一个 DOM 元素，也不会出现在组件的父组件链中。
slot <slot> 元素作为组件模板之中的内容分发插槽。<slot> 元素自身将被替换。

以上。