vue專案常用的方法封裝
阿新 • • 發佈:2018-12-16
vue全家桶構建專案過程中,需要經常呼叫一些方法,比如axios的請求,下面就將經常用的方法進行封裝
import Vue from 'vue' import axios from 'axios' import qs from 'qs' import Router from 'vue-router' const $router = new Router() Vue.prototype.$ajax = axios Vue.prototype.$qs = qs //介面的統一域名部分 Vue.prototype.urlPrefix = 'http://xxxxxxxxxx/' //呼叫ajax方法 Vue.prototype.c_ajax = function (p, u, c,e) { //p.token = window.localStorage.getItem('token'),這是本地存token,也可以用vuex p.token = this.$store.state.token; this.$ajax.post(this.urlPrefix + u, this.$qs.stringify(p)).then(value => c(value)).catch(value=>e(value)) } //上傳檔案方法 Vue.prototype.c_file = function (p, u, c,e) { p.token = this.$store.state.token; let config ={ headers:{'Content-Type':'multipart/form-data'} } this.$ajax.post(this.urlPrefix + u, this.$qs.stringify(p),config).then(value => c(value)).catch(value=>e(value)) } // 獲取本地儲存方法 Vue.prototype.getLocalObj = function (n) { return (window.localStorage[n] && typeof window.localStorage[n] !== 'undefined' && window.localStorage[n] !== 'undefined') ? JSON.parse(window.localStorage[n]) : '' } // 設定本地儲存方法 Vue.prototype.setLocalObj = function (n, o) { window.localStorage[n] = (typeof o === 'object') ? JSON.stringify(o) : o } // 圖片處理,如果沒有圖片則使用預設圖片 Vue.prototype.imgPath = function(data){ let tempdata = /^(https:|http:)/g; if(data){ if(tempdata.test(data)){ return data }else{ return (this.urlPrefix + data) } }else{ return 'static/img/nopng.jpg' } }