一、vuex狀態管理
首先下載vuex模塊
npm install vuex -save
1、在store文件夾下新建5個子文件 每個文件夾的名字和內容如下所示
store.png
其中mutation-types.js中常量名用大寫英文+下劃線形式表示
2、配置vuex全局 vuex的全局配置與上一節中vue-router的配置相似,抽象上我們有一個store文件夾,store文件夾下內容是實現,main.js中調用實現的內容。 我們看到import store from 'store/index' 代表引用store的index實現,在第12行中將store的實現作爲參數賦值給Vue的全局配置進行使用,這樣所有的頁面都可以使用Vuex了。
vuex全局.png
二、axios 網絡訪問請求配置
config目錄下新建http.js,文件中設置訪問baseUrl,從config/env.js中讀取,可以區別運行環境和實際環境,方便發佈修改網絡訪問。 選用vue 2.0 推薦的的axios,擴充response攔截器和request攔截器
request攔截器
request攔截器判斷是否存在token,如果存在在頭信息的驗證屬性(Authorization)增加對應token值
image.png
response攔截器
response攔截器,設置出錯對應請求狀態嗎錯誤時,需要的判斷。基礎判斷爲401和404.
image.png
放置對axios的全局配置
在main.js中配置Axios的全局
image.png
三、moment 時間轉換組件
時間組件使用moment.js 官網:http://momentjs.cn/
項目整合方式: 1、控制檯輸入命令 npm install moment --save ,將moment包引入文件 2、進入src/main.js主目錄,編輯一下代碼,引用成功
moment.png
四、Fastclick整合
1、首先安裝fastclick依賴 2、輸入命令:yarn add fastclick 進入項目目錄src/main.js進行如下操作
fastclick.png