vue-cli 中axios 跨域方案

最近在学vue，遇到跨域问题，纠结好久，看百度的方法都是一样的，不知为什么相同的代码在我的项目中就请求不到，试验了好多次，终于成功啦！

接下来就聊聊axios，在vue-cli中的操作。

一、安装

npm install axios --save-dev

二、跨域使用

1、在config 文件夹下的index.js中配置 如下：

2、在main.js中引入并进行全局设置 如下：

3、在模板中发起请求 如下：

注意：

1. main.js中 $axios 可以自定义，但要和模板中的$axios 保持一样；

2. get/post 方法中一定要加上 api/ （也可以自定义） 。

3.这里的api 相当于 配置中的 target:"http://127.0.0.1/" 地址后面最好加上 /  符号，这样get（）里面 的api 前面可以不用再加 /  了。

三、post 请求方法

模板中 传参 的写法要注意

1. this.$axios.post('url',{name:'李白'}).then(fn1(),fn2())

   2.引入qs

import Qs from 'qs'

this.$axios.post('url',Qs.stringify({

        name:'李白',

        age:22

}).then(fn1(),fn2())

注意：

qs.stringify( ) 和 JSON.stringify( ) 的区别

他们解析出来的格式不一样（一个是表单格式，一个是字符串格式）

这只是目前遇到的几点问题，还有好多请求方法没研究，以后遇到再回头看看！

扫码关注

更多精彩