vue网络请求及跨域问题

main.js中

使用axios网络请求:

1.下载axios及vue-axios;指令:npm i axios --save 以及 npm i vue-axios --save

2.在单组件中使用axios网络请求,为了不每次都在不同的组件中导入axios,供该组件使用;可以在main.js中全局引入axios,供全局组件访问

3.在组件中直接调用网络请求的方法

this.$http.get(url).then(res =>{}) get方式的请求

this.$http.post().then(res =>{}) post方式的请求

this.$http({

    url:"",

    method:"",

    data:{   post请求传递的参数

    }

}).then(res =>{

    res 请求成功的数据

}).catch(err =>{

    err 请求失败的数据

})  推荐使用的方式

 

封装的网络请求与React封装的一样 netWorkRequest.js

 

跨域代理问题

如果接口出现跨域问题,需要在vue框架中设置axios的跨域代理

1.首先, 需要找到当前项目路径下的vue.config.js文件

2.在vue.config.js文件中添加新的键值对

3.在网络请求的位置url地址使用/api代理原网址域名

在vue.config.js文件中