Vue.js是一個漸進式框架，只需要具備基本的HTML/CSS/JavaScript基礎就可以快速上手。在用Vue.js構建大型應用時推薦使用NPM安裝，但是需要注意npm的版本需要大於3.0。
在通過npm安裝項目後，我們需要對其目錄進行解析：
（1） Build：項目構建（webpack）相關代碼;
（2） config：配置目錄，包括端口號等。
（3） node_modules：npm加載的項目依賴模塊
（4） src：這個目錄當中的內容包含了我們基本上要做的事情，這裡包含了幾個文件：
（一）assets：存放圖片
（二）components：存放組件文件
（三）App.vue：項目入口文件，組件也可以直接寫在這裡不適用components
（四）main.js：核心文件
（5） static：靜態資源目錄
（6） test：初始測試目錄
（7） .xxxx：配置文件，包括git配置和語法配置等
（8） index.html：首頁
（9） package.json：項目配置文件
（10） README.md：說明文檔
程序=數據結構+算法，但這話在前端裡並不純粹，因為前端需要和界面打交道，所以大概總結下基礎操作dom的前端開發方式：前端程序=拼界面+操作ui+算法。Vue的mvvm框架給了前端另一種思路：完全基於數據驅動的編程。幫助你從繁雜的dom操作中解脫出來，迴歸本質。
使用Vue的過程就是定義MVVM各個組成部分過程的過程
（1） 定義View
（2） 定義Model
（3） 創建一個Vue實例或“ViewModel”
在創建Vue實例的時候，需要傳入選項對象，可以包含掛載元素、數據等。Vue.js有很多數據綁定語法，最基礎的的是文本插值，在運行時{{ message }}會被數據對象的message屬性替換。
Vue實例被創建前會經過初始化，然後在數據變化時更新DOM，在這個期間也會調用一些生命週期鉤子，從而我們可以自定義邏輯。總共可以分為8個段：
（1） beforeCreate 初始化實例後 數據觀測和事件配置之前調用
（2） created 實例創建完成後調用
（3） beforeMount 掛載開始前被用
（4） mounted el被新建vm.$el替換並掛在到實例上之後調用
（5） beforeUpdate 數據更新時調用
（6） updated 數據更改導致的DOM重新渲染後調用
（7） beforeDestory 實例被銷燬前調用
（8） destroyed 實例銷燬後調用
需要注意的是created和mounted的區別，created是實例已經創建但未掛載，所以一些dom操作要放在mounted中。
Vue組件的API來自props（允許外部環境傳遞數據給組件）、events（允許組件觸發外部環境副作用）和slots（允許外部環境將額外的內容組合在組件中）三個部分，組件的data屬性必須是函數。儘管有props和events，但有時候需要js直接訪問子組件，所以可以使用ref為子組件指定一個索引ID。
Vue.js的插件應當有一個公開方法install。該方法的第一個參數是Vue構造器 , 第二個參數是一個可選的選項對象。
可通過全局方法Vue.use()使用插件:
//調用 `MyPlugin.install(Vue)`
Vue.use(MyPlugin)
也可以傳入一個選項對象:
Vue.use(MyPlugin, { someOption: true })
在vue-router中有兩種導航方式：
（1）router-link聲明式導航
router-link對應的路由匹配成功，將自動設置class屬性值.router-link-active。
（2）編程式導航：
router.push('home')
// 對象
router.push({ path: 'home' })
// 命名的路由
router.push({ name: 'user', params: { userId: 123 }})
// 帶查詢參數，變成 /register?plan=private
router.push({ path: 'register', query: { plan: 'private' }})
閱讀更多 千鋒H5 的文章
