1.新建文件夹 util , 在util里边新建 mm.jsx文件

2.使用jquery里边的ajax发送请求,回调用promise,返回一个promise对象

  1. request(param){
  2.         return new Promise((resolve, reject) => {
  3.             $.ajax({
  4.                 type : param.type || 'get',
  5.                 url : param.url || '',
  6.                 dataType : param.dataType || 'json',
  7.                 data : param.data || null,
  8.                 success : res => {
  9.                     // 数据请求成功
  10.                     if(0 === res.status){
  11.                         typeof resolve === 'function' && resolve(res.data, res.msg);
  12.                     }
  13.                     // 没有登录状态,强制登录
  14.                     else if(10 === res.status){
  15.                         this.doLogin();
  16.                     }
  17.                     else{
  18.                         typeof reject === 'function' && reject(res.msg || res.data);
  19.                     }
  20.                 },
  21.                 error : err => {
  22.                     typeof reject === 'function' && reject(err.statusText);
  23.                 }
  24.             });
  25.         });
  26.     }

3.页面引入

  1. const _mm = new MUtil();

4.使用,传入参数

  1. // 首页数据统计
  2.    getHomeCount(){
  3.        return _mm.request({
  4.            url: '/manage/statistic/base_count.do'
  5.        });
  6.    }

React后台管理系统-ajax请求封装的更多相关文章

  1. [Web 前端] 如何在React中做Ajax 请求?

    cp from : https://segmentfault.com/a/1190000007564792 如何在React中做Ajax 请求? 首先:React本身没有独有的获取数据的方式.实际上, ...

  2. React 中的 AJAX 请求:获取数据的方法

    React 中的 AJAX 请求:获取数据的方法 React 只是使用 props 和 state 两处的数据进行组件渲染. 因此,想要使用来自服务端的数据,必须将数据放入组件的 props 或 st ...

  3. jQuery-实现简单的Ajax请求封装

    封装的意义在于复用,在于减少重复的代码. 我在项目中做了简单的Ajax请求封装,实现方式如下: //封装Ajax请求 $.extend({ ajaxDirect:function(url,type,d ...

  4. Django(十二)视图--利用jquery从后台发送ajax请求并处理、ajax登录案例

    一.Ajax基本概念 [参考]:https://www.runoob.com/jquery/jquery-ajax-intro.html 异步的javascript.在不全部加载某一个页面部的情况下, ...

  5. 《React后台管理系统实战 :三》header组件:页面排版、天气请求接口及页面调用、时间格式化及使用定时器、退出函数

    一.布局及排版 1.布局src/pages/admin/header/index.jsx import React,{Component} from 'react' import './header. ...

  6. React后台管理系统-后台接口封装

    1新建文件夹 service ,里边建4个文件,分别是statistic-service.jsx 首页数据统计接口, user-service.jsx用户接口, product-service.jsx ...

  7. 《React后台管理系统实战 :一》:目录结构、引入antd、引入路由、写login页面、使用antd的form登录组件、form前台验证、高阶函数/组件

    实战 上接,笔记:https://blog.csdn.net/u010132177/article/details/104150177 https://gitee.com/pasaulis/react ...

  8. react中使用Ajax请求(axios,Fetch)

    React本身只关注于界面, 并不包含发送ajax请求的代码,前端应用需要通过ajax请求与后台进行交互(json数据),可以使用集成第三方ajax库(或自己封装) 常用的ajax请求库 jQuery ...

  9. 【共享单车】—— React后台管理系统开发手记:主页面架构设计

    前言:以下内容基于React全家桶+AntD实战课程的学习实践过程记录.最终成果github地址:https://github.com/66Web/react-antd-manager,欢迎star. ...

随机推荐

  1. MarkDown基础语法大全

    一.MarkDown是什么? Markdown是一种轻量级的「标记语言」,创始人为约翰·格鲁伯,用简洁的语法代替排版,目前被越来越多的知识工作者.写作爱好者.程序员或研究员广泛使用.其常用的标记符号不 ...

  2. docker下载安装教程(Linux系统)

    原文链接:http://www.studyshare.cn/blog-front//software/details/1160/0一.检查 1.检查安装的docker 命令:yum list inst ...

  3. PHP与thinkphp中var_dump()打印数组显示不全问题

    在我们进行php开发的时候,经常会使用var_dump()函数进行数组的打印,以方便我们程序的调试,而有时候我们在进行多维数组打印的时候会发现多维数组打印不全,有些地方被…代替,这就是我们php配置的 ...

  4. Jmeter3.2源码编译环境搭建(转)

    1.下载jmeter3.2源码 https://github.com/apache/jmeter/tree/v3_2 https://blog.csdn.net/fly_to_higher/artic ...

  5. Asp.net Core 添加 EF 工具并执行初始迁移错误解决方法(Add-Migration Initial---Build failed.)

    1.问题: 首次在ASP.NET Core项目中使用Code First模式的Entity Framework框架,在添加EF工具并做初始化迁移(perform initial migration), ...

  6. @Inherited:允许子类继承父类的注解。

    在看定义注解的相关文章的时候,看到这个@Inherited注解,简单的说明并没有真正搞懂是什么意思.在网上搜索了一些相关的内容,现在把一篇文章转载过来.以便后面使用. 文章出处,转载地址:(http: ...

  7. smarty模板引擎之if, elseif else

    Smarty 中的 if 语句和 php 中的 if 语句一样灵活易用,并增加了几个特性以适宜模板引擎. if 必须于 /if 成对出现. 可以使用 else 和 elseif 子句. 可以使用以下条 ...

  8. mysql 链接时报错:1251-Client does not support authentication protocol requested by server

    一 原因是mysql服务器要求的认证插件版本与客户端不一致造成的. 二 由于我是最新的mysql和破解版的navicat,那么就是mysql太高级了. 解决方法有两个,我毫不犹豫的选择mysql降级. ...

  9. C#实现对EXCEL指定单元格进行操作

    using System; using System.Collections.Generic; using System.Text; using Microsoft.Office.Interop.Ex ...

  10. 自定义控件使用GDI+绘制旋转Label文字

    http://www.cnblogs.com/CUIT-DX037/ 1.添加用户控件: 2.添加代码: public partial class UcLabel : UserControl { pu ...