axios请求

可以将请求放在函数里，封装成一个个的模块。

  • 注意先安装axios，使用命令：​​npm install axios --save​​
  • 可以放置在工具文件夹utils目录下，里面包含request.js以及其他的请求函数。
// request.js
import axios from 'axios'

export default request(config){
  //1.创建一个axios实例
  const service = axios.create({
    baseURL:'http://localhost:8080/home', //基础路由
    timeout:5000
  })
  //2.1 请求过滤器（拦截器）
  service.interceptor.request.use(config => {
    return config
  },err => {
    console.log(err)
  })
  //2.2 响应过滤器（拦截器）
  service.interceptor.response.use(res => {
    return res.data
  },err => {
    console.log(err)
  })
  //3.发送真正的网络请求
  return service(config)
}
// user.js
import { request } from './request.js'

export function getUserList(){
    return request({
        url:'/api/get/users'
    })
}
  • 最后在相应的组件中调用即可，注意上述函数返回的是​​promise​​​，在组件中，比如​​home.js​​中可以如下书写：
<script>
//从user.js中导入getUserList方法
import { getUserList } from 'utils/user'
export default({
    created(){
    //获取用户的信息
    this.getUserList();
    },
    methods:{
        getUserList(){
            getUserList().then(res => {
                return res
            }
        }
    }
})
</script>