博主個人部落格**
promise和ajax功能類似，都是用來做非同步請求的。promise的優勢在於可以鏈式程式設計，在response還沒回應時，then操作中可以把正常流程**實現，catch捕獲異常（而且可以放在最後進行統一捕獲），可以不斷then 下去； 前後端分離大背景下，ajax是基於原生的xhr，已經不能很好的適應mvvm這種前端模型了。
本章主要是用來描述vue專案開發前端頁面的，為何先介紹promise呢？因為vue核心元件始終是圍繞著promise展開的；如vuex.store的 actions 中方法 都是用promise來實現的；後端api互動用的axios，也是promise封裝的。
先簡單申明乙個promise物件；
new
promise
(function
(resolve, reject)
)
promise狀態說明，從初始化時pending——》到resolved或rejected（只能是二者中某一種狀態），在未呼叫resolve或reject方法時，promise都是pending狀態，一旦呼叫了resolve或reject方法 promise就結束了，promise狀態為resolved或rejected；其建構函式中不能進行其他操作了，只能進行後續的then或catch操作了（then 、catch也是promise型別物件）。
所以promise 生命流程 只有兩種狀態 ；
正常的： pending狀態（未呼叫resolve方法前）---->resolved狀態；
或者失敗的 ： pending狀態（未呼叫rejecte方法前）-------> rejected狀態
resolved狀態promise能使用then進行後續處理，rejected狀態promise物件可以用catch進行處理；在呼叫方法resolve()改變promise狀態時，可以傳遞引數，如resolve(data)（只能接收乙個引數，多個引數想辦法合併成陣列），後續接著用then處理；then的構造器中可以直接使用傳遞過來的data；這樣無限的then搞下去，引數就通過resolve方法來傳遞。如果非同步請求獲取物件不符合要求，判斷後，rejecte方法來改變promise狀態 也可以通過它傳遞引數，最終變成rejected狀態的promise，這種狀態promise能呼叫catch，在其構造器中進行後續異常捕獲或丟擲操作。
登入過程
this
.$store.
dispatch
('login'
,this
.loginform)
.then((
)=>
)this
.loading =
false})
.catch((
)=>
)
login
(, userinfo)
= userinfo
return
newpromise
((resolve, reject)
=>).
then
(response =>
= response
commit
('set_token'
, data.token)
settoken
(data.token)
resolve()
}).catch
(error =>)}
)},
通過上面** ，可以總結出利用promise 構造登入的非同步請求
new promise((resovle,reject)=>)
.catch(err=> )
})
rejected狀態promise與catch鏈式處理示例：
promise物件（有呼叫reject方法的）.
catch((
)=>).
catch
(err =>
);
在vue專案中, mock資料
1.在根目錄下建立 test 目錄,用來存放模擬的 json 資料,在 test 目錄下建立模擬的資料 data.json 檔案 2.在build目錄下的 dev server.js的檔案作如下更改 3.在.vue做請求,就可以成功獲取data.json的資料了,下面使用 axios 進行請求axi...
在 Vue 專案中使用 ECharts
重要檔案版本 在 vue 專案中使用 echarts 只需要在 vue 元件的mounted生命週期中 初始化 echarts，然後在每次配置項有變更時呼叫setoption 方法更新配置即可 專案模板原始碼 class default chart style div template import...
在vue專案中使用echarts
安裝echarts依賴 npm install echarts s 建立圖表 全域性引入 main.js 引入echarts import echarts from echarts vue.prototype.echarts echarts 這裡也可以在router下index.js引入，看規定 h...