npm安裝

npm install axios --save

main.js導(dǎo)入

// 引入axios，并加到原型鏈中 import Axios from 'axios' import QS from 'qs' Vue.prototype.$axios = Axios Vue.prototype.qs = QS

各子模塊中使用，通過原型鏈 this.$axios ......

get實(shí)例

<div id="app"><h1>網(wǎng)站列表</h1><divv-for="site in info">{{ site.name }}</div> </div> <script type = "text/javascript"> new Vue({el: '#app',data () {return {info: null}},mounted () {axios.get('https://www.xxxx.com/try/ajax/json_demo.json').then(response => (this.info = response.data.sites)).catch(function (error) { // 請求失敗處理console.log(error);});} }) </script>

post實(shí)例

<script> new Vue({el: '#app',data () {return {info: null}},mounted () {axios.post('https://www.xxxxx.com/try/ajax/demo_axios_post.php', {firstName: 'Fred', // 參數(shù) firstNamelastName: 'Flintstone' // 參數(shù) lastName}).then(response => (this.info = response)).catch(function (error) { // 請求失敗處理console.log(error);});} }) </script>

執(zhí)行多個(gè)并發(fā)請求

function getUserAccount() {return axios.get('/user/12345'); }function getUserPermissions() {return axios.get('/user/12345/permissions'); } axios.all([getUserAccount(), getUserPermissions()]).then(axios.spread(function (acct, perms) {// 兩個(gè)請求現(xiàn)在都執(zhí)行完成}));

axios API

axios(config) // 發(fā)送 POST 請求 axios({method: 'post',url: '/user/12345',data: {firstName: 'Fred',lastName: 'Flintstone'} }); // GET 請求遠(yuǎn)程圖片 axios({method:'get',url:'http://bit.ly/2mTM3nY',responseType:'stream' }).then(function(response) {response.data.pipe(fs.createWriteStream('ada_lovelace.jpg')) }); axios(url[, config]) // 發(fā)送 GET 請求（默認(rèn)的方法） axios('/user/12345');

?

總結(jié)

以上是生活随笔為你收集整理的vue使用axios并存数据到state的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

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