寫在前面：vue-resource可以發(fā)送ajax，實(shí)現(xiàn)異步加載，但是Vue官方已經(jīng)不再維護(hù)這個(gè)庫了。

vue-resource依賴于vue，因此要先引入vue，再引入vue-resource。正確引入vue-resource后，再vue全局上會(huì)掛載一個(gè)$http方法，其上有一系列方法，每個(gè)HTTP請(qǐng)求類型都會(huì)對(duì)應(yīng)一個(gè)方法。且vue-resource使用了promise，所以$http中的方法的返回值是一個(gè)promise。

目錄

1.請(qǐng)求方法

（1）POST請(qǐng)求

（2）GET請(qǐng)求

（3）PUT請(qǐng)求

（4）PATCH請(qǐng)求

（5）DELETE請(qǐng)求

（６）HEAD請(qǐng)求

（7）JSONP請(qǐng)求

2.響應(yīng)對(duì)象

（1）屬性

（2）方法

---

1.請(qǐng)求方法

（1）POST請(qǐng)求

post請(qǐng)求用于提交數(shù)據(jù)

常用data格式：

1）表單提交：multiparty / form-data，比較老的網(wǎng)站會(huì)使用表單提交去獲取數(shù)據(jù)，現(xiàn)在基本都不會(huì)用表單提交，而是使用ajax，但是現(xiàn)在表單提交仍然存在，有時(shí)候需要做圖片上傳、文件上傳；

2）文件上傳：application / json，現(xiàn)在大多數(shù)情況下都是用這個(gè)格式。

使用方法：vm.$http.post(url,[body],[options])

1）url：必需，請(qǐng)求目標(biāo)url；

2）body：非必需，作為請(qǐng)求體發(fā)送的數(shù)據(jù)；

3）options：非必需，作為請(qǐng)求體發(fā)送的數(shù)據(jù)

（2）GET請(qǐng)求

get請(qǐng)求用于獲取數(shù)據(jù)

使用方法：vm.$http.get(url,[options])

（3）PUT請(qǐng)求

put請(qǐng)求用于更新數(shù)據(jù)，將所有的數(shù)據(jù)全都推送到后端

使用方法：vm.$http.put(url,[body],[config])

（4）PATCH請(qǐng)求

patch請(qǐng)求用于更新數(shù)據(jù)，將修改的數(shù)據(jù)全都推送到后端

使用方法：vm.$http.patch(url,[body],[config])

（5）DELETE請(qǐng)求

delete請(qǐng)求用來刪除數(shù)據(jù)

使用方法：vm.$http.delete(url,[config])

（６）HEAD請(qǐng)求

head請(qǐng)求用來請(qǐng)求頭部信心

使用方法：vm.$http.headf(url,[config])

（7）JSONP請(qǐng)求

除了jsonp以外，以上6種的API名稱是標(biāo)準(zhǔn)的HTTP方法

使用方法：vm.$http.jsonp(url,[config])

this.$http.jsonp('https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su', {params: {wd: 'nn'},jsonp: 'cb' }).then(res => {console.log(res) })

?【注】option參數(shù)說明

2.響應(yīng)對(duì)象

（1）屬性

屬性類型描述

url	String	響應(yīng)的URL源
body	Object，Bolb，string	響應(yīng)體數(shù)據(jù)
headers	Header	請(qǐng)求頭部對(duì)象
ok	Boolean	當(dāng)HTTP響應(yīng)碼為200到299之間的數(shù)值時(shí)該值為true
status	Number	HTTP響應(yīng)碼
statusText	String	HTTP響應(yīng)狀態(tài)

（2）方法

方法描述

text()	以字符串方式返回響應(yīng)體
json()	以格式化后的json對(duì)象方式返回響應(yīng)體
bolb()	以二進(jìn)制Bolb對(duì)象方式返回響應(yīng)體

this.$http.jsonp('https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su', {params: {wd: 'nn'},jsonp: 'cb' }).then(res => {return res.text(); }).then(res => {console.log(res) })

總結(jié)

以上是生活随笔為你收集整理的Vue_异步加载_vue-resource（不再维护）的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。