目录

 

正文

预期的mock的使用方式

首先我们从使用的角度出发，思考编码过程

  • M1. 通过配置文件配置url和response

  • M2. 自动检测环境为开发环境时启动Mock.js

  • M3. mock代码能直接覆盖global.fetch方法或者XMLHttpRequest构造函数，实现开发无感知

  • M4. mock配置不影响实际的请求，可无缝切换为实际请求

M1. 通过配置文件配置url和response

比较符合我们使用习惯的，也许是下面这种mock方式,有一个专门的配置文件，管理请求的url和返回值。每个请求对应输出数组中的一个对象，对象的rule属性可以是一个字符串或者一个正则表达式，用来匹配url,对象的res属性则是我们希望的从中请求中拿到的返回的数据 （也许这里面还应该加个type表示请求的类型，但是我这个是mock的最简化版，所以就不加了）

复制代码
// api.jsmodule.exports = [   {     rule: '/mock',     res: {       a: 'data',       b: [{c: 1}, {d: 1}],     },   },   {     rule: '/mock2',     res: {       j: {          k: 'XXX'       },     },   }, ];
复制代码

 

M2. 自动检测环境为开发环境时启动Mock.js

复制代码
// __DEV__ 可能是webpack等配置的全局变量if (__DEV__) {   require ('./ajaxMock.js');   require ('./fetchMock.js'); }
复制代码

 

M3. mock代码能直接覆盖global.fetch方法或者XMLHttpRequest构造函数，实现开发无感知

复制代码
//