【Element UI】axios 与 Api文件夹的配置

request.js文件

import axios from 'axios'

// axios 创建请求
const service = axios.create({
  baseURL: 'http://127.0.0.1:8000/', // 请求域名
  timeout: 5000
})

// 设置拦截器
service.interceptors.request.use(config => {
  // 如果存有token就携带上
  if (window.sessionStorage.getItem('token')) {
    config.headers.authenticate = window.sessionStorage.getItem('token')
  }
  return config // 返回的请求头
}
)

// 响应器
service.interceptors.response.use(response => {
  const res = response
  console.log('响应', res)
  return res // 这里返回的是 请求后的结果  如果不return 那么请求的回调会获取不到数据
}
)

export default service

 

api.js 文件

import request from '@/utils/request.js'

// 登陆
export function loginUser (data) {
  return request({
    url: 'api/login',
    method: 'post',
    data
  })
}

 

请求组件使用


// 请求组件
import { loginUser } from '@/api/user.js'


 // 登录
    Login () {
      var datas = {
        username: this.login.username,
        password: this.login.password
      }
      loginUser(datas).then((res) => {
        console.log('登录', res)
      })
    },

 

上一篇:公司网络web服务器负载均衡解决方案


下一篇:在Vue中,axios封装、api封装、调接口