vue-钩子/ 虚拟DOM / 模板语法

钩子
原名是“hook”，它是一种事件劫持机制，也就是说它会比你的事件更早进行执行处理。
路由导航钩子 ： vue-router
beforeRouteEnter 钩子 不能 访问 this，因为钩子在导航确认前被调用,因此即将登场的新组件还没被创建。不过，你可以通过传一个回调给 next来访问组件实例。在导航被确认的时候执行回调，并且把组件实例作为回调方法的参数。
生命周期钩子
挂载 mount 将设备作为系统的一个文件进行操作。就是通过这种方式，将原本电脑不认识的设备识别为电脑认识的文件或者认识的设备。以便对设备进行操作。

---

虚拟DOM
在如今的应用程序的DOM中大概有成千上万的节点，因此更新所花费的时间就更长了。有很多不可避免的很小很频繁的更新拖慢了页面的速度。
DOM 节点也可以表示 JavaScript 中的对象， 也就是虚拟DOM

// Pseudo-code of a DOM node represented as Javascript
Let domNode = {
  tag: 'ul'
  attributes: { id: 'myId' }
  children: [
    // where the LI's would go
  ]
};

虚拟DOM利弊分析

大小 - 其中之一就是更多的功能意味着代码包中更多行的代码。幸运的是，Vue.js 2.0 依旧比较小（当前版本 21.4kb），并且也正在删除很多东西。

内存 -同样，虚拟DOM需要将现有的DOM拷贝后保存在内存中，这是一个在DOM更新速度和内存使用中的权衡。

并不适用所有情况 -如果虚拟DOM可以一次性进行批量的修改是非常好的。但是如果是单独的、稀少的更新呢？这样的任何DOM更新都将会使虚拟DOM带来无意义的预计算。

优： 但是对于多数的单页面应用来说，它还是会带来提升的。
为什么做这个？它为你的JavaScript带来了全编程能力。你可以通过使用JavaScript的数组方法来创建工厂化函数来搭建你的虚拟节点等等，这些用模板语法处理起来可能会更复杂。

---

模板语法
Vue.js 使用了基于 HTML 的模版语法，允许开发者声明式地将 DOM 绑定至底层 Vue 实例的数据。
Vue.js 的核心是一个允许你采用简洁的模板语法来声明式的将数据渲染进 DOM 的系统。