这篇文章主要介绍了vue下axios怎么封装get和post方法的相关知识,内容详细易懂,操作简单快捷,具有一定借鉴价值,相信大家阅读完这篇vue下axios怎么封装get和post方法文章都会有所收获,下面我们一起来看看吧。
vue 2.x axios 封装的get 和post方法
import axios from 'axios'import qs from 'qs'export class HttpService { Get(url, data) { return new Promise((resolve, reject) => { axios.get(url, { params: data }).then((res) => { if (res) { //成功回调 resolve(res); } }).catch((error) => { reject(error); }) }) } Post(url, data) { return new Promise((resolve, reject) => { axios.post(url, qs.stringify(data), { headers: { 'Content-Type': 'application/x-www-form-urlencoded', 'Accept': 'application/json' } }).then((res) => { if (res) { //成功回调 resolve(res); } }).catch((error) => { reject(error); }) }) }}
postfile方法
PostFlie(url, data) { return new Promise((resolve, reject) => { //根据data对象生成FormData对象 var temp = new FormData(); for (var t in data) { temp.append(t, data[t]); } axios.post(url, temp).then((res) => { if (res) { resolve(res.Data); } }).catch((error) => { reject(error); }) }) }
Vue的优点
Vue具体轻量级框架、简单易学、双向数据绑定、组件化、数据和结构的分离、虚拟DOM、运行速度快等优势,Vue中页面使用的是局部刷新,不用每次跳转页面都要请求所有数据和dom,可以大大提升访问速度和用户体验。
关于“vue下axios怎么封装get和post方法”这篇文章的内容就介绍到这里,感谢各位的阅读!相信大家对“vue下axios怎么封装get和post方法”知识都有一定的了解,大家如果还想学习更多知识,欢迎关注编程网行业资讯频道。