vuejs中axios的使用方法:1、安裝axios;2、在main.js頁面引用axios;3、透過「created(){this.$axios({method:'post',url: 'api'...}」方式使用即可。
本文操作環境:Windows7系統、vue2.9.6版,DELL G3電腦。
vuejs中axios用法是什麼?
vue中axios基本用法
1.首先安裝axios:
1):npm install 2):npm install vue-axios --save 3):npm install qs.js --save //这一步可以先忽略,它的作用是能把json格式的直接转成data所需的格式
2.安裝成功後,在main.js頁面引用:
import Vue from 'vue' import axios from 'axios' Vue.prototype.$axios = axios //全局注册,使用方法为:this.$axios Vue.prototype.qs = qs //全局注册,使用方法为:this.qs
3最後開始使用請求:
<script> export default{ data(){ return{ userId:666, token:'', } }, created(){ this.$axios({ method:'post', url:'api', data:this.qs.stringify({ //这里是发送给后台的数据 userId:this.userId, token:this.token, }) }).then((response) =>{ //这里使用了ES6的语法 console.log(response) //请求成功返回的数据 }).catch((error) => console.log(error) //请求失败返回的数据 }) } } </script>
同時發起多個請求
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) { // Both requests are now complete }));
创建一个实例 你可以创建一个拥有通用配置的axios实例 axios.creat([config]) var instance = axios.create({ baseURL: 'https://some-domain.com/api/', timeout: 1000, headers: {'X-Custom-Header': 'foobar'} });
推薦學習:《vue教學》
以上是vuejs中axios用法是什麼的詳細內容。更多資訊請關注PHP中文網其他相關文章!