mock.js进行接口mock

1、安装

// node 安装
npm install mockjs

// 引入 mockjs 模块
import Mock from 'mockjs' 

2、基础用法

/**
 * @method Mock.mock(rurl, template) 
 * @param [String] curl 拦截的请求url
 * @param [Object] template 生成数据的模板
 */

Mock.mock('hello.php', {
    'list|1-5': [{
        name: '@name',
        email: '@email',
        createTime: '@date'
    }]
})

$.ajax({
    url: 'hello.php',
    dataType: 'json'
}).done(function(data, status, jqXHR) {
    $('<pre>').text(JSON.stringify(data, null, 4))
        .appendTo('body')
})

3、模块化引用

// 定义并导出 mock 模块
import Mock from 'mockjs';

export default Mock.mock('hello.php', {
    'list|1-5': [{
        'id|+1': 1,
        'email': '@EMAIL',
        'regexp3': /\d{5,10}/
    }]
});

//  引入定义好的模块
import data from './mock';

axios.get('hello.php')
  .then(function (response) {
    console.log(response);
  })

• Mock.mock(rurl, template) 方法表示拦截 ajax 请求 'hello.php'，通过模板生成模拟数据返回
• list|1-5 表示随机生成属性名为 list 的数据 1-5条， 管道符号 | 左侧表示属性名，右侧表示生成规则
• @name 表示随机生成 name 值， @ 表示占位符，引用的是 Mock.Random 中的方法

链接：https://www.jianshu.com/p/2eaa7506cb27