首先下载charles软件地址，更详细的使用方法都包含在操作文档里，包含汉化版补丁（下载后查看）

链接：https://pan.baidu.com/s/1Q5rMbcX0Wus7AwdGUWa-Wg

提取码：mkgt

如何利用charles来mock呢？首先我们要新建一个json文件来写我们的json数据

1.点击菜单栏中的工具

2.点击本地映射

3.勾选启用本地映射

4.点击添加

5.协议(http) => 主机(localhost) => 端口(当前本地端口号) => 路径(/api/lala) => 点击选择，选择自己创建的json文件 => 点击确定

6.ajax请求/api/lala接口，就可以返回数据了

大家学会了吗？

react中使用charles实现本地数据mock的更多相关文章

  1. 【React自制全家桶】七、React实现ajax请求以及本地数据mock

    一.下载axios插件 yarn add axios 二.React的ajax请求代码如何放置 建议放置在生命周期函数之componentDidMount()中 三.ajax之get请求 axios. ...

  2. layui中的submit提交本地数据在控制在输出为空数组(解决)

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. React中利用axios来实现数据请求

    axios是基于Promise来封装的,通常我们会用axios在数据请求这块作如下配置: 一.拦截器 有注释,不难理解,通常请求头参数不是写死的,应该是去浏览器中读的,例如,login之后返回toke ...

  4. 11. react 基础 使用charles 模拟接口数据

    charles参考文档 charles官网 模拟数据 模拟 axios 请求的数据 eg: 1. 编写 axios 请求 axios.get('/api/xxx') .then(()=>{ale ...

  5. React中父子组件数据传递

    Vue.js中父子组件数据传递:Props Down ,  Events Up Angular中父子组件数据传递:Props Down,  Events  Up React中父子组件数据传递:Prop ...

  6. 前端MVVM模式及其在Vue和React中的体现

    MVVM相关概念 Mvvm 前端数据流框架精讲 1) MVVM典型特点是有四个概念:Model.View.ViewModel.绑定器.MVVM可以是单向绑定也可以是双向绑定甚至是不绑定 2) 绑定器: ...

  7. 前端开发数据mock神器 -- xl_mock

    1.为什么要实现数据 mock 要理解为什么要实现数据 mock,我们可以提供几个场景来解释, 1.现在的开发很多都是前后端分离的模式,前后端的工作是不同的,当我们前端界面已经完成,但是后端的接口迟迟 ...

  8. React中的Ajax

    React中的Ajax 组件的数据来源,通常是通过Ajax请求从服务器获取,可以使用componentDidMount方法设置Ajax请求,等到请求成功,再用this.setState方法重新渲染UI ...

  9. vue-cli3.x中使用axios发送请求,配合webpack中的devServer编写本地mock数据接口(get/post/put/delete)

    vue-cli3.x中使用axios发送请求,配合webpack中的devServer编写本地mock数据接口(get/post/put/delete) 手把手式笔记 Axios配置 安装 axios ...

随机推荐

  1. Apifox（1）比postman更优秀的接口自动化测试平台

    Apifox介绍 Apifox 是 API 文档.API 调试.API Mock.API 自动化测试一体化协作平台,定位 Postman + Swagger + Mock + JMeter.通过一套系 ...

  2. 【简】题解 P5283 [十二省联考2019]异或粽子

    传送门:P5283 [十二省联考2019]异或粽子 题目大意: 给一个长度为n的数列,找到异或和为前k大的区间,并求出这些区间的异或和的代数和. QWQ: 考试时想到了前缀异或 想到了对每个数按二进制 ...

  3. Mysql配置文件 16c64g优化

    目录 一.说明 二.配置 一.说明 以下配置适合16核64G及以上的配置,会让性能稍微提高1/3左右. 二.配置 my.cnf [client] port = 3306 socket = /usr/l ...

  4. pipeline post指令

    目录 一.介绍 二.参数说明 三.使用实例 一.介绍 post步骤包含的是在整个pipeline或阶段完成后一些附加的步骤.post步骤是可选的,所以并不包含在声明式pipeline最简结构中,但这并 ...

  5. Memcached 状态机分析

    worker线程拿到了这个连接之后,就应该是分配给这个连接一个结构体,包括这个连接所有的状态,都写buf等,这个结构体就是conn,然后这个worker线程会在它自己的event_base加入对这个新 ...

  6. iOS 实现简单的界面切换

    以下是在iOS中最简单的界面切换示例.使用了多个Controller,并演示Controller之间在切换界面时的代码处理. 实现的应用界面: 首先,创建一个window-based applicat ...

  7. [BUUCTF]REVERSE——[GKCTF2020]BabyDriver

    [GKCTF2020]BabyDriver 附件 步骤: 例行检查,64位程序,无壳 64位ida载入,检索程序里的字符串,看到提示flag是md5(input),下方还看到了类似迷宫的字符串 找到关 ...

  8. 合并项目（Project）

    <Project2016 企业项目管理实践>张会斌 董方好 编著 在熬肥的世界里,有个大难题,就是多文件合并-- 好吧,以前是大难题,现在,早就不是了,Word有主控文档,Excel有&q ...

  9. Java的对象与类,继承

    Java的对象与类,继承 题目1.Java类的建立与使用 设计一个用来描述汽车的类,使用类的非静态成员变量来表示汽车的车主姓名.当前的速率和当前方向盘的转向角度,使用类的非静态成员方法来表示改变汽车的 ...

  10. Sublime Text3 Package Control Emmet插件安装

    https://www.cnblogs.com/carrie-hong/p/4995735.html https://www.cnblogs.com/tamato-jacob-wealllostcon ...