一,vue-resource請求數據
介紹:vue-resource請求數據方式是官方提供的一個插件
步驟:
1,npm安裝


npm install vue-resource --save
或者使用cnpm淘寶鏡像安裝,會快很多。cnpm install vue-resource --save
加--save是為了在package.json中引用,表示在生產環境中使用。因為我們在日常開發中,如果我們要打包代碼給其他人或者上傳到github,又或者要發布代碼時,package.json就是安裝所需要的包。如果只在開發環境中使用,則只需要--save-dev,有一些只在開發環境中用,有一些要在生產環境中用。
2,在main.js入口文件中引入vue-resource


引入之后要使用這個插件


如果不使用此插件的話,會報如下錯誤:


3,在項目中用this.$http.get()等等使用,詳情看 vue-resource github
實例:


注意:this.$http.get()等等的各種http請求都是繼承promise的。promise是異步的請求;其次,.then箭頭函數里的this代表的是上下文。根據箭頭函數this的定義,只在函數定義時就已經賦值可知,this,指代的是定義函數的對象,在vue中對象就是methods當前頁面。所以this指導的是data里面的數據。如果想要獲取包裹函數外函數的數據,即閉包的概念。實現方法就是在外層函數加一個var that = this;將外層的this先儲存到that中。如下實例,同時還解決了跨域的問題:

二,axios請求數據
介紹:這是一個第三方的插件 github地址:https://github.com/axios/axios
第一步:npm安裝 npm install axios -save


第二步:直接調用。和vue-resource的區別是:aixos是每在一個頁面用一次就要在該頁面調用一次。vue-resource是綁定了全局的了。具體使用方法可以看github:


第三步:關於axios的跨域請求
在config->index.js->proxyTable配置如下:target填寫自己想要的地址


如下配置,url為地址后面所帶的參數,配置好后,現在npm run dev 運行就行。


第四步:關於多個並發請求:


上面這個是同一地址的跨域,如果要拿不同地址的跨域,只需要更改config->index.js->proxyTable的配置,增加地址塊就行。
三,關於fetch-jsonp