之前工作的时候用过vue开发,但是脚手架是老大提供,自己也没实际搭建过,最近有时间,自己走了一遍整个流程,到axios这里还是遇到了一些问题,就总结一下,好记性不如烂笔头,这话不假

1.安装axios之后,在main.js中引入:(这样在组件中使用this.$axios即可)

import axios from 'axios';

Vue.prototype.$axios = axios;

2.直接使用的时候,遇到了跨域问题,控制台报错大概会有Access-Control-Allow-Origin之类的红色字样,找到config/index.js,p配置dev里的proxyTable

dev: {
  // Paths
  proxyTable: {
    '/api': {
      target: 'http://***:8080/',
      changeOrigin: true,
      pathRewrite: {
        '^/api': '/'//这里用‘/api’代替target里面的地址,调用'http://***:8080/user/add',可写成‘/api/user/add’
      }
    }
  }

3.之后开始测试是否正确:

1)this.$axios.get('/api/huoDongList').then(res => console.log(res));可以请求

2)this.$axios.post('/api/List',params).then(res => console.log(res));

params是这样来的:(这样才能保证传输给后端的是键值对key:value形式);这里的话,方法应该还有别的,vue的qs模块,具体用法有时间再看

var params = new URLSearchParams();
params.append('json', '123');(‘123’就是你要传输给后代的value)

Logo

前往低代码交流专区

更多推荐