安裝axios npm install axios --save
新建一個js文件任意取名，這里是http.js
import axios from 'axios' import { Message } from 'element-ui'; //element庫的消息提示，可以不用 //創建axios實例 var service = axios.create({ baseURL: 'https://www.xx.com/v1/', timeout: 5000, headers: { 'content-type': 'application/json', "token":'14a1347f412b319b0fef270489f' } }) export default { service, //get請求 get(url, data) { return service({ url: url, method: 'get', data }) } }
main.js中引入這個文件，做全局使用
prototype屬性是JS用法，每一個構造函數都有一個屬性叫做原型(prototype),默認情況下prototype屬性會默認獲得一個constructor(構造函數)屬性
//這里是vue的主js入口文件 import Vue from 'vue' import App from './App.vue' import http from './http.js' //axios實例化后引入取名http Vue.prototype.http = http //放入全局 new Vue({ render: h => h(App) }).$mount('#app')
組件中調用封裝的axios方式：
<script> //生命周期函數 mounted (){ this.http.get('banner/1').then(res=>{ console.log(res.data) }) } </script>
