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. bzoj 3992: [SDOI2015]序列统计 NTT+原根

    今天开始学习丧心病狂的多项式qaq......    . code: #include <bits/stdc++.h> #define ll long long #define setIO ...

  2. class-transformer 方便的json 对象转class

    在我们日常web开发中经常碰到需要json 到类的处理,因为json 就是普通的数据,没有处理能力,class 具有业务处理能力, 但是需要数据的支持,class-transformer 刚好做为了一 ...

  3. ES6 String和Number扩展

    一.String 扩展 ①传统上,JavaScript 只有indexOf方法,可以用来确定一个字符串是否包含在另一个字符串中.ES6 又提供了三种新方法. includes():返回布尔值,表示是否 ...

  4. SDL

    SDL介绍 SDL(Simple DirectMedia Layer)是一套开放源代码的跨平台多媒体开发库,使用C语言写成.SDL提供了数种控制图像.声音.输出入的函数,让开发者只要用相同或是相似的代 ...

  5. java自动化配置工具 - autoconfig 简介

    对于java程序员来说各种各样的配置文件是司空见惯的,比如spring的bean配置,struts的action配置等等.有些配置会随着运行环境的变化而各不相同,最典型的就是jdbc驱动的配置,在开发 ...

  6. 冰多多团队-第五次Scrum会议

    冰多多团队-第五次Scrum会议 工作情况 团队成员 已完成任务 待完成任务 zpj 部分Action整合, 接入语音接口,整合项目解决兼容性问题 ASR bug修复 牛雅哲 跑通了科大讯飞语法识别的 ...

  7. [技术博客]采用Qthread实现多线程连接等待

    采用Qthread实现多线程连接等待 ​ 本组的安卓自动化测试软件中,在测试开始前需要进行连接设备的操作,如下图左侧的按钮 ​ ​ 后端MonkeyRunner相关操作的程序中提供了connect() ...

  8. Tomcat 9 管理界面配置

    Tomcat9 在conf/tomcat_user.xml配置后,还是出现如下错误 然后修改tomcat9/webapps/manager/META-INF的context.xml文件

  9. The Rise of Meta Learning

    The Rise of Meta Learning 2019-10-18 06:48:37 This blog is from: https://towardsdatascience.com/the- ...

  10. 阿里巴巴Druid数据源组件

    目前常用的数据源主要有c3p0.dbcp.proxool.druid,先来说说他们Spring 推荐使用dbcp:Hibernate 推荐使用c3p0和proxool1. DBCP:apacheDBC ...