axios是vue-resource的替代品,vue-resource不再維護。
安裝axios:npm install axios
使用vue-cli開發時,由於專案本身啟動本地服務是需要占用乙個埠的,所以會產生跨域的問題。在使用webpack做構建工具的專案中,使用proxytable**實現跨域是一種比較方便的選擇。
通過this.$http去呼叫axios,如果之前你的vue-resourse也是這麼寫的話,可以無縫切換。換成this.axios也是沒有問題的。
2:在需要調介面的元件中這樣使用:
axios.post('/api/yt_api/login/dologin',postdata)
.then(function (response) )
.catch(function (error) )
注意:原介面:http://
頁面呼叫:http://localhost:8081/api/yt_api/login/dologin ——這裡多了乙個/api/不是多餘的,不要刪
二:axios傳參
1:vue官方推薦元件axios預設就是提交 json 字串,所以我們要以json字串直接拼接在url後面的形式,直接將json物件傳進去就行了
let postdata =
axios.get('/api/yt_api/login/dologin',
}).then(function (response) )
.catch(function (error) );
這裡我們將postdata這個json物件傳入到post方法中
2:以key:val的形式傳參
(1).安裝qs:npm install qs
(2).對這個json物件操作
let postdata = qs.stringify()
(3).再匯入
import qs from 'qs'
Vue用axios跨域訪問資料
vue用axios跨域訪問資料 axios是vue resource的替代品,vue resource不再維護。安裝axios npm install axios 使用vue cli開發時,由於專案本身啟動本地服務是需要占用乙個埠的,所以會產生跨域的問題。在使用webpack做構建工具的專案中,使用...
vue2 Axios解決跨域訪問
這裡以訪問 ve2x 的乙個公告api為例,直接訪問如下 this.axios.get then res catch err 直接訪問瀏覽器會報跨域問題 首先在main.js中,配置下我們訪問的url字首 import vue from vue import axios from axios vue...
axios跨域訪問配置
跨域訪問技術 cors cross origin resource sharing 同源策略 same origin policy 在乙個瀏覽器中訪問的 不能訪問另乙個 中的資料,除非這兩個 具有相同的origin,也即是擁有相同的協議 主機位址以及埠。一旦這三項資料中有一項不同,那麼該資源就將被認...