具體實現思路=》封裝之前需要用npm安裝並引入axios,使用一個單獨的js模塊作為接口請輸出對象,然后export dafult 這個對象。
1.首先我們需要在Vue實例的原型prototype中擴展一個$http的方法取代axios=>Vue.prototype.$http=axios這樣子就可以在組件中通過this.$http方法引用axios的get等內置API
2.將方法寫在一個對象中方便調用=> 類似這個就將該請求方法寫在了xhr這個對象中,
3.通過=>方法全局注冊Vue原型方法$xhr下的xhr對象,export之后可以在組件中通過下面方法實現調用,類似於jq的ajax的請求以及回調格式
this.$xhr.xhr.httpRequest({//xhr對象中封裝的ajaxrequest方法
url:'url地址',
data:{
//傳參
},
success:=>(data){//此處data相當於封裝的ajaxrequest方法中的res.data
//回調處理邏輯
}
})
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
一個簡單的基於Vue-axios接口請求封裝完畢!!