在配置了router后我们可以先进性axios 的配置。
如果你没有安装 可以使用
npm i axios -S
现在我们可以在项目的src 目录下 新建一个文件夹,request 并在下面新建index.js,
首先我们先引用axios 然后 用axios.create创建,然后导出 如果你要请求的接口比较多 也可用一个专门的api.js来管理
index.js内容
import axios from 'axios'
const $http = axios.create({
baseURL: ''
})
//这里是配置请求头的部分
$http.interceptors.request.use(config => {
var xtoken = JSON.parse(window.localStorage.getItem('token'))
// console.log(xtoken)
if (xtoken) {
xtoken = 'Bearer' + xtoken
// console.log(xtoken)
config.headers['Authorization'] = xtoken
}
return config
})
$http.interceptors.response.use(res => {
return res
})
export default $http
写完之后我们需要将axios引入到main.js中
main.js
import Vue from 'vue'
import App from './App'
import router from './router'
import $http from './request'
Vue.config.productionTip = false
Vue.prototype.$http = $http
/* eslint-disable no-new */
new Vue({
el: '#app',
router,
components: { App },
template: '<App/>'
})
这是你可以在页面的created 和 monted 用
this.$http.get/post('path')
.then(res => {console.log(res)})
请求一下
下面我们要进行vuex 的使用
网友评论