vue学习笔记
vue.js
提醒：Vuejs 如今正处在快速发展中，很多资源随时都有可能过时（outdated），记得查看最新文档，使用最新资源。
Vue 的官方说明
数据驱动的组件，为现代化的 Web 界面而生。
Vue.js（读音 /vjuː/, 类似于 view）是一个构建数据驱动的 web 界面的库。Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。
Vue.js 自身不是一个全能框架——它只聚焦于视图层。因此它非常容易学习，非常容易与其它库或已有项目整合。另一方面，在与相关工具和支持库一起使用时，Vue.js 也能完美地驱动复杂的单页应用。
关于 Vue 的作者
尤雨溪 / 昵称：尤小右 / 英文名：Evan You
是个介于设计师和程序员之间的大牛，设计能力比程序员好，编程能力比设计师（和普通程序员）好太多！
如今辞了工作，专心投入到了 Vuejs 的发展和推广中。
工作信息：
Meteor (2014 - 2016)
地区：海外 ，美国
职位：Core dev
Google (2012 - 2014)
地区：海外 ，美国
职位：Creative Lab
相关信息：
JavaScript Air Episode 016: JavaScript Frameworks: Vue.js
和 Vue.js 框架的作者聊聊前端框架开发背后的故事 | Teahour.fm
Vue 的基本用法
Vue 相比于 React 和 Angular 容易上手多了，因此我对 Vue 的学习主要以文档为主，视频为辅（只有像我这种菜鸟才看视频教程，真正的牛人文档瞄几眼就会了(-_-#)）。
下载使用（两种方式）
直接下载并用 <script> 标签引入，Vue 会被注册为一个全局变量。
平时对于 Dom 操作比较频繁的小项目可以直接这样使用。
Vue.js 提供一个官方命令行工具，可用于快速搭建大型单页应用。该工具提供开箱即用的构建工具配置，带来现代化的前端开发流程。只需一分钟即可启动带热重载、保存时静态检查以及可用于生产环境的构建配置的项目：
针对单页应用的构建推荐使用这种方式，可以更好的体验到 vue 所提供的组件化功能 （单文件组件），顺带着享受到 webpack 带来的流畅的自动化开发体验。
# 全局安装 vue-cli
$ npm install -g vue-cli
# 创建一个基于 "webpack" 模板的新项目
$ vue init webpack my-project
# 安装依赖，走你
$ cd my-project
$ npm install
$ npm run dev
Vue 的使用教程
废话不多说，大家直接看官方文档，已经写得非常棒了。
页面上的搜索功能可以快速帮助你定位到相关文档说明，非常方便。
针对相关问题的解决方法：
问题：Vue 还未实例化前， HTML 模板中的 "{{ }}"( Mustache 标签) 会暴露在用户界面上，也就是说页面有那么一瞬间会将所有的 "{{ }}" 都显示出来，如何解决？
解决：
方法一：使用 v-cloak 指令，这个指令保持在元素上直到关联实例结束编译。和 CSS 规则如 [v-cloak] { display: none } 一起用时，这个指令可以隐藏未编译的 Mustache 标签直到实例准备完毕。
v-cloak 文档说明
[v-cloak] {
display: none;
}<div v-cloak>
{{ message }}
</div>方法二：使用 v-text
v-text 文档说明
<span v-text="msg"></span>
<!-- same as -->
<span>{{msg}}</span>问题：新增的 data 数据没法同步响应到页面？
解决：认真阅读官方文档里的深入响应式原理。
在实例创建之后添加属性并且让它是响应的:
对于 Vue 实例，可以使用 $set(key, value) 实例方法：
vm.$set('b', 2)
// `vm.b` 和 `data.b` 现在是响应的对于普通数据对象，可以使用全局方法 Vue.set(object, key, value)：
Vue.set(data, 'c', 3)
// `vm.c` 和 `data.c` 现在是响应的注意事项：
注意如果 prop 是一个对象或数组，是按引用传递。在子组件内修改它会影响父组件的状态，不管是使用哪种绑定类型
针对同一个元素的后一个 watch 会覆盖前一个 watch，无论是不是 deep
自定义指令内部可以通过 this.vm.someKey 来访问到组件的数据
自定义指令名不要有大写，props 命名也不要有大写
Vue 的组件化实践
组件（Component）是 Vue.js 最强大的功能之一。组件可以扩展 HTML 元素，封装可重用的代码。在较高层面上，组件是自定义元素，Vue.js 的编译器为它添加特殊功能。在有些情况下，组件也可以是原生 HTML 元素的形式，以 is 特性扩展。
使用上文提到的官方命令行工具：
目前可供使用的模板包括（模板名-说明）：
webpack - A full-featured Webpack + vue-loader setup with hot reload, linting, testing & css extraction.（全功能的 Webpack + vue-loader 设置，包括热加载，静态检测，测试，css 提取）
webpack-simple - A simple Webpack + vue-loader setup for quick prototyping.（一个简易的 Webpack + vue-loader 设置，以便于快速开始）
browserify - A full-featured Browserify + vueify setup with hot-reload, linting & unit testing.（全功能的 Browserify + vueify 设置，包括热加载，静态检测，单元测试）
browserify-simple - A simple Browserify + vueify setup for quick prototyping.（一个简易的 Browserify + vueify 设置，以便于快速开始）
simple - The simplest possible Vue setup in a single HTML file
相关阅读：
Announcing vue-cli
（译）Vuejs 自己的构建工具 vue-cli
