本文为博主原创,转载请注明出处

  axios在上一篇中讲过:vue中axios使用一:axios做拦截器,axios是请求后台资源的模块,用来请求后台资源。

  axios本身是支持get,post请求后台数据,示例如下:

post方式:

axios.post('/user', {
firstName: 'Fred',
lastName: 'Flintstone'
})
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
});

  get方式:

axios.get('/user?ID=12345')
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
});

  axios不支持jsonp的方式,在网上搜寻了很多的方式,找到一个可以使用jsonp在前端跨域请求的一个方法,特此记录

    axios不支持jsonp,因为axios的作者觉得jsonp不太友好,推荐用CORS方式更为干净,但是jsonp支持范围更加广阔一些,

  一些老式的IE浏览器也能支持,所以有些公司还是jsonp用的多些,那么如果要使用jsonp,可以独立安装

  npm i jsonp --save-dev 然后在页面中引用import jsonp from 'jsonp',使用方式也是非常简单的:

 jsonp(config.ajaxUrl + '路径', null, (err, data) => {
if (err) {
console.error(err.message);
} else {
if (data.list.length > 0) {
data.list.map((item) => this.list.push(item))
console.log(data);
}
}
})

vue中axios使用二:axios以post,get,jsonp的方式请求后台数据的更多相关文章

  1. Vue 使用 axios post请求后台数据时 404

    今天遇到Vue 使用 axios post请求后台数据时 404 使用postman 就能获取到 网上找了大半天 终于找到了解决方法,传送门:https://www.jianshu.com/p/b10 ...

  2. jquery中ajax请求后台数据成功后既不执行success也不执行error解决方法

    jquery中ajax请求后台数据成功后既不执行success也不执行error,此外系统报错:Uncaught SyntaxError: Unexpected identifier at Objec ...

  3. vue 请求后台数据2(copy)

    https://blog.csdn.net/vergilgeekopen/article/details/68954940 需要引用vue-resource 安装请参考https://github.c ...

  4. 在vue中实现扫描二维码跳转页面

    文字少的博文不允许发布到网站首页.文字少的博文不允许发布到网站首页.文字少的博文不允许发布到网站首页.文字少的博文不允许发布到网站首页.文字少的博文不允许发布到网站首页.文字少的博文不允许发布到网站首 ...

  5. vue中,写在methods里的B方法去调A方法的数据,访问不到?

    今天在写项目的时候,发现了一个京城性忽略的问题,在vue的methods的方法里面定义了两个方法,如下: getTaskList() { api.growthDetails.taskList({ ap ...

  6. vue 请求后台数据 (copy)

    https://www.cnblogs.com/calledspeed001/p/7094494.html var that=this get请求 that.$http.get("1.txt ...

  7. Vue中实现与后台的数据交换(vue-resource)

    vue-resource是Vue.js的一款插件,它可以通过XMLHttpRequest或JSONP发起请求并处理响应.(但是目前它已经停止更新了) 1.在vue中安装vue-resource插件 打 ...

  8. vue中axios使用封装

    一.在main.js导入 // 引入axios,并加到原型链中 import axios from 'axios'; Vue.prototype.$axios = axios; import QS f ...

  9. Vue(项目踩坑)_解决vue中axios请求跨域的问题

    一.前言 今天在做项目的时候发现axios不能请求跨域接口 二.主要内容 1.之前直接用get方式请求聚合数据里的接口报错如下 2.当前请求的代码 3.解决方法 (1)在项目目录中依次找到:confi ...

随机推荐

  1. java 时间格式

    自定义时间格式:yyyy 年MM 月dd 天HH 24小时制hh 12小时制mm 分钟ss 秒 java.util.Date日期格式为:年月日时分秒 java.sql.Date日期格式为:年月日jav ...

  2. golang之数据转换

    golang按位取反符号和异或符号都是^. fmt.Printf("0x%X\n", 0xFF^0x55) var a uint8 = 0x55 fmt.Printf(" ...

  3. IP分片攻击——就是发送部分分片报文,让对方一直等待从而耗对方内存的DoS攻击

      为了传送一个大的IP报文,IP协议栈需要根据链路接口的MTU对该IP报文进行分片,通过填充适当的IP头中的分片指示字段,接收计算机可以很容易的把这些IP分片报文组装起来. 目标计算机在处理这些分片 ...

  4. Linux学习25-Xshell设置页面最大显示行数

    前言 在使用xshell查看日志的时候,有时候日志太多,往上翻的时候,前面的就找不到了. 需要设置xshell的页面显示最大行数,查看更多的日志详情. 设置显示行数 左上角-文件-属性 终端-设置最大 ...

  5. JavaScript数组常用操作方法

    ES5操作数组的方法 1.concat() concat() 方法用于连接两个或多个数组.该方法不会改变现有的数组,仅会返回被连接数组的一个副本. var arr1 = [1,2,3]; var ar ...

  6. test20191210 钟子谦

    100+40+0=140.暴力没写满-- 简单模拟 很久很久以前,有一个 \(1\sim n\) 的排列 \(a\),还有一个长度为 \(q\) 的,每个元素在 \(1\) 到 \(n\) 之间的序列 ...

  7. cmds挖掘redolog

      select member from v$logfile;   exec dbms_logmnr.add_logfile(logfilename=>'+CMDSDG/cmds/onlinel ...

  8. wordpress调用置顶文章sticky_posts的三种方法

    有时我们在开发wordpress时需要调用置顶文章sticky_posts,怎么调用呢?几种写法,有用到query_post的,有用到WP_Query,也有用到is_sticky(),下面随ytkah ...

  9. spark——故障排除

    故障排除一:控制reduce端缓冲大小以避免OOM 在Shuffle过程,reduce端task并不是等到map端task将其数据全部写入磁盘后再去拉取,而是map端写一点数据,reduce端task ...

  10. 关于ArrayList

    List概述 List是一个列表结构抽象定义,有序的,可对其中每个元素的插入位置进行精确地控制,可以通过索引来访问元素,遍历元素.包括函数的有:添加元素,删除元素,判断是否包含元素等等重要函数.   ...