色婷婷狠狠18禁久久YY,CHINESE性内射高清国产,国产女人18毛片水真多1,国产AV在线观看

vue ajax請求封裝

洪振霞2年前9瀏覽0評論

Vue中進行ajax請求的時候,需要使用一些較為復雜的代碼,而簡化這一過程需要使用到封裝。

import axios from 'axios'
export default function ajax ({ url, method = 'GET', params = {}, data = {} }) {
return axios({
method,
url,
params,
data
})
}

在上述代碼中,我們引入了axios庫,并且導出一個方法ajax, 注入進來一個對象,這個對象中包含了請求方式、請求url、傳遞的參數以及數據等,這種方式可以使請求接口更加方便。

接下來進行一個請求的具體示范:

import ajax from '@/utils/ajax'
// 請求組件中定義api地址
let findCategoryApi = 'manager/category/findCategory'
// findCategory內調用
// 請求數據
getCategoryData () {
ajax({
url: this.findCategoryApi,
params: this.searchData
})
.then(res =>{
let result = res.data.data
if (result) {
this.tableData = result
}
})
.catch(() =>{})
}

在上面這個示例中,我們首先在組件開頭定義了一個api地址, 然后在請求的函數中,使用了封裝的ajax請求,并且傳入了url以及params參數,這個時候, ajax被調用后會發送一個請求到后端,并且將請求參數傳入到接口中,同時如果請求得到了數據, 則會返回一個包含了數據的promise,我們在then函數中進行數據的處理。

總結:在Vue中,封裝ajax請求有很多好處,不僅可以省去很多重復代碼,更是可以保證程序的簡潔和性能,同時由于現在前后端分離的趨勢, 使用這種做法甚至可以在多端共享。