1、jQuery中的ajax

get方法:
$.ajax({
url:"v4/api/film/now-playing?t=1539401039415&page=1&count=5",
     type:"GET", 
success:(result)=>{
return result
}
})

post方法:

$.ajax({
type: "POST",
url: "v4/api/film/now-playing",
  data: {
    t:"1539401039415",
    page:"1",
    count:"5"
  },
  success: function(result){
     return result
  }
});

2、axios的方式

get请求方式:

import axios from 'axios'
axios({
method:"get"
url:"/listall/list"
params: { //向后端传的参数
code: '1234',
name: 'yyy',
},
})
.then(result => {
return result.data
})
.catch(error => {
return error
})

post请求方式:

import axios from 'axios'

let data = new FormData();
data.append('code','1234');
data.append('name','yyyy'); axios({
method:"post"
url:"/listall/list"
data //向后端传的参数
})
.then(result => {
return result.data
})
.catch(error => {
return error
})

3、fetch方法:

post方法:

return () => {
let formData = new FormData();
formData.append('city_id', index);
fetch('/index/hotsShowList', {
method: 'POST',
headers:{
'Accept': 'application/json, text/javascript, */*; q=0.01'
},
body: formData
}).then(response => {
// 将数据处理为 JSON 格式,返回一个 Promise
return response.json();
})
.then(data => {
// console.log(data.data)
});
}

get方法:

return () => {
fetch('/index/hotsShowList?city_id=5', {
method: 'GET',
headers:{
'Accept': 'application/json, text/javascript, */*; q=0.01'
},
}).then(response => {
// 将数据处理为 JSON 格式,返回一个 Promise
return response.json();
})
.then(data => {
// console.log(data.data)
});
}

前端向后端获取数据的三种方法:ajax、axios、fetch的更多相关文章

  1. Struts2(四.注册时检查用户名是否存在及Action获取数据的三种方式)

    一.功能 1.用户注册页面 <%@ page language="java" contentType="text/html; charset=UTF-8" ...

  2. jQuery中通过JSONP来跨域获取数据的三种方式

    第一种方法是在ajax函数中设置dataType为'jsonp' $.ajax({ dataType: 'jsonp', url: 'http://www.a.com/user?id=123', su ...

  3. 体温数据上传程序开发+获取时间的三种方法+DB Browser下载及安装

    今天开始了体温上传程序的开发 今日所学: 获取时间 (21条消息) (转)安卓获取时间的三种方法_sharpeha的博客-CSDN博客_安卓获取时间 DB Browser安装教程 (20条消息) sq ...

  4. 关于Hive创建分区目录且能查到数据的三种方法

    关于Hive创建分区目录且能查到数据的三种方法 1. 使用dfs -mkdir 和 dfs -put 分别创建分区目录和上传数据,此时执行msck repair table 表名 命令就能查询到数据 ...

  5. java 获取随机数的三种方法

    方法1(数据类型)(最小值+Math.random()*(最大值-最小值+1))例:(int)(1+Math.random()*(10-1+1))从1到10的int型随数 方法2获得随机数for (i ...

  6. python网络编程调用recv函数完整接收数据的三种方法

    最近在使用python进行网络编程开发一个通用的tcpclient测试小工具.在使用socket进行网络编程中,如何判定对端发送一条报文是否接收完成,是进行socket网络开发必须要考虑的一个问题.这 ...

  7. 去除DataTable重复数据的三种方法

    业务需求 最近做一个把源数据库的数据批次导出到目标数据库.源数据库是采集程序采集而来的原始数据库,所以需要对其进行一些处理(过滤一些为空,长度太短或太长,非法字符,重复数据)然后在进行入库. 其中要避 ...

  8. 去除DataTable重复数据的三种方法(转)

    转自:https://www.cnblogs.com/sunxi/p/4767577.html 业务需求 最近做一个把源数据库的数据批次导出到目标数据库.源数据库是采集程序采集而来的原始数据库,所以需 ...

  9. C# Entity Framework 更新数据的三种方法

    例: 实体类: public class TestDbContext : DbContext { public DbSet<Test> Tests { get; set; } public ...

随机推荐

  1. hihocoder#1046: K个串

    [传送门] 这种区间内相同数字只能被统计一次/只有区间内数字都不相同才对答案有贡献的题都可以用扫描线扫右端点,表示当前区间右端点为$r$.然后当前线段树/树状数组维护区间左端点为$[1,r)$时对应的 ...

  2. Boggle Game

    Description Given a board which is a 2D matrix includes a-z and dictionary dict, find the largest co ...

  3. Python错误 -- try/except/finally 、调用栈、记录错误、抛出错误

    Bug:程序编写有问题造成的错误,称之为Bug.    debug:调试 注意:bug是程序本身有问题.有缺陷.系统漏洞 异常:完全无法在程序运行中预测的错误,例如写入文件的时候,磁盘满了,写不进去了 ...

  4. 第03组 Alpha冲刺

    队名:不等式方程组 组长博客 作业博客 团队项目进度 组员一:张逸杰(组长) 过去两天完成的任务: 文字/口头描述: 制定了初步的项目计划,并开始学习一些推荐.搜索类算法 GitHub签入纪录: 暂无 ...

  5. 原创:Kmeans算法实战+改进(java实现)

    kmeans算法的流程:   EM思想很伟大,在处理含有隐式变量的机器学习算法中很有用.聚类算法包括kmeans,高斯混合聚类,快速迭代聚类等等,都离不开EM思想.在了解kmeans算法之前,有必要详 ...

  6. linux高性能服务器编程 (八) --高性能服务器程序框架

    第八章 高性能服务器编程框架 这一章主要介绍服务器的三个主要模块: I/O处理单元.逻辑单元.存储单元.另外服务器的模型有:C/S模型和P2P模型.虽然服务器模型比较多,但是其核心框架都一样,只是在于 ...

  7. R 语言中的数据结构

    基本数据类型 6种 numaric  如 12, 12.4 integer  如 2L,0L complex  包含实数和虚数 如 3+2i character  要用双引号或者单引号包括起来 如 & ...

  8. MyBatis(十一):Mybatis 动态SQL语句完成多条件查询

    之前文章中对in的用法做过讲解:<MyBatis(四):mybatis中使用in查询时的注意事项> 实际上对于多个参数的用法也是这是注意的: 多参&if判空&List集合判 ...

  9. Java NIO 堆外内存与零拷贝

    一.直接缓存 这个例子的区别就是 ByteBuffer.allocateDirect(512); 进入allocateDirect方法 进入DirectByteBuffer构造函数 Native方法: ...

  10. jquery给label绑定click事件被触发两次解决方案

    首先我们看下面的代码片段(label包裹checkbox) <div class="example"><label for="chk_6" c ...