一,vue-resource請求數(shù)據(jù)
介紹:vue-resource請求數(shù)據(jù)方式是官方提供的一個插件
步驟:
1,npm安裝
npm? install vue-resource? --save
或者使用cnpm淘寶鏡像安裝嗡载,會快很多。cnpm? install? vue-resource? --save
加--save是為了在package.json中引用悲酷,表示在生產(chǎn)環(huán)境中使用嘶卧。因?yàn)槲覀冊谌粘i_發(fā)中,如果我們要打包代碼給其他人或者上傳到github俯萎,又或者要發(fā)布代碼時傲宜,package.json就是安裝所需要的包。如果只在開發(fā)環(huán)境中使用夫啊,則只需要--save-dev函卒,有一些只在開發(fā)環(huán)境中用,有一些要在生產(chǎn)環(huán)境中用撇眯。
2报嵌,在main.js入口文件中引入vue-resource
引入之后要使用這個插件
如果不使用此插件的話,會報如下錯誤:
3熊榛,在項目中用this.$http.get()等等使用锚国,詳情看 vue-resource? github
實(shí)例:
注意:this.$http.get()等等的各種http請求都是繼承promise的。promise是異步的請求玄坦;其次血筑,.then箭頭函數(shù)里的this代表的是上下文。根據(jù)箭頭函數(shù)this的定義煎楣,只在函數(shù)定義時就已經(jīng)賦值可知豺总,this,指代的是定義函數(shù)的對象择懂,在vue中對象就是methods當(dāng)前頁面喻喳。所以this指導(dǎo)的是data里面的數(shù)據(jù)。如果想要獲取包裹函數(shù)外函數(shù)的數(shù)據(jù)休蟹,即閉包的概念沸枯。實(shí)現(xiàn)方法就是在外層函數(shù)加一個var that =? this;將外層的this先儲存到that中赂弓。如下實(shí)例绑榴,同時還解決了跨域的問題:
二,axios請求數(shù)據(jù)
介紹:這是一個第三方的插件? github地址:https://github.com/axios/axios
第一步:npm安裝? npm install axios? -save
第二步:直接調(diào)用盈魁。和vue-resource的區(qū)別是:aixos是每在一個頁面用一次就要在該頁面調(diào)用一次翔怎。vue-resource是綁定了全局的了。具體使用方法可以看github:
第三步:關(guān)于axios的跨域請求
在config->index.js->proxyTable配置如下:target填寫自己想要的地址
如下配置,url為地址后面所帶的參數(shù)赤套,配置好后飘痛,現(xiàn)在npm run? dev 運(yùn)行就行。
第四步:關(guān)于多個并發(fā)請求:
上面這個是同一地址的跨域容握,如果要拿不同地址的跨域宣脉,只需要更改config->index.js->proxyTable的配置,增加地址塊就行剔氏。
三塑猖,關(guān)于fetch-jsonp