学习笔记： 自定义指令
自定义指令
自定义指令的注册方法分为 全局注册 和 局部注册 ，比如注册一个 v-focus 指令，用于在 <input> 、 <textarea> 元素初始化时自动获得焦点，两种写法分别是：
//全局注册
Vue.directive('focus', {});
//局部注册
new Vue({
el: '#app',
directives: {
focus: {}
}
});
大约 3 分钟
学习笔记： Vue.js基础知识
基础知识
构造函数Vue的根实例 new Vue({}) ，并启动Vue应用。
var app = Vue({
el: "#app",
data: {},
methods: {}
});大约 4 分钟
学习笔记： 方法与事件
方法与事件
@click调用得方法名后可以不跟括号 () ，如果该方法有参数，默认会将原生事件对象 event 传入。
这种在HTML元素上监听事件的设计看似将DOM与JavaScript紧耦合，违背分离的原理，实则刚好相反。因为通过HTML就可以知道调用的是哪个方法，将逻辑与DOM解耦，便于维护。
**最重要的是，当viewModel 销毁时，所有的事件处理器都会自动销毁，无需自己处理。 **
大约 2 分钟
学习笔记： 前端开发文档
计算属性
所有的计算属性都以函数的形式写在Vue实例中的 computed 选项内，最终返回计算后的结果。
计算属性的用法
在一个计算属性中可以完成各种复杂的逻辑，包括运算、函数调用等，只要最终返回一个结果即可。
计算属性还可以依赖多个Vue实例的数据，只要其中任一数据变化，计算属性就会重新执行，视图也会更新。
每一个计算属性都包含一个 getter 和一个 setter 。
大约 5 分钟
查看 原文站点 ，更多扩展内容及更佳阅读体验！
实战：常用组件的开发
数字输入框只能输入数字，而且有两个快捷按钮，可以直接减1或加1。除此之外，还可以设置初始值、最大/小值，在数值改变时，触发一个自定义事件来通知父组件。
目录文件：
index.html入口页input-number.js数字输入框组件index.js根实例
大约 4 分钟
查看 原文站点 ，更多扩展内容及更佳阅读体验！
组件详解
组件与复用
Vue组件需要注册后才可以使用。注册有全局注册和局部注册两种方式。
全局注册
Vue.component('my-component', {});大约 19 分钟
学习笔记： 函数化组件
函数化组件
Vue提供了一个 functional 的布尔值选项，设置为 true 可以使组件无状态和无实例，也就是没有 data 和 this 上下文。这样用 render 函数返回虚拟节点可以更容易渲染，因为函数化组件只是一个函数，渲染开销要小很多。
使用函数化组件时，Render函数提供了第二个参数 context 来提供临时上下文。组件需要的 data 、 prop 、 slots 、 children 、 parent 都是通过这个上下文来传递。比如 this.level 要改写为 context.props.level ， this.$slots.default 改变为 context.children 。
大约 5 分钟
函数化组件
Vue提供了一个 functional 的布尔值选项，设置为 true 可以使组件无状态和无实例，也就是没有 data 和 this 上下文。这样用 render 函数返回虚拟节点可以更容易渲染，因为函数化组件只是一个函数，渲染开销要小很多。
使用函数化组件时，Render函数提供了第二个参数 context 来提供临时上下文。组件需要的 data 、 prop 、 slots 、 children 、 parent 都是通过这个上下文来传递。比如 this.level 要改写为 context.props.level ， this.$slots.default 改变为 context.children 。
大约 5 分钟
学习笔记： Render函数
Render函数
Vue2 与 Vue1 最大的区别就在于 Vue2 使用了虚拟 DOM 来更新 DOM 节点，提升渲染性能。
Vue2与Vue1最大的区别就在于Vue2使用了虚拟DOM来更新DOM节点，提升渲染性能。
大约 5 分钟
大约 3 分钟