前端项目中加入mockjs

本文介绍如何使用MockJS来模拟接口返回数据,包括安装配置、基本用法及如何设置模拟数据格式。通过具体实例演示了如何针对特定URL设置数据响应,并展示了如何控制模拟的AJAX请求时间。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

安装

Node (CommonJS)
执行命令 npm install mockjs

使用demo

项目根目录下, 新建mockTest文件夹(与biz同级),新增xxx.js,以下以 ‘我的’ 模块查询客户经理信息交易为例子,该交易请求的url为/pb-app-webapp/customer/getCustomerManagerByCustomerPhone

    module.exports = function(app) {

    var Mock = require('mockjs')

    Mock.mock('/pb-app-webapp/customer/getCustomerManagerByCustomerPhone', {
        'data|5':[{
            'name': '@cname',
            'organizationName': '@region',
            'organizationBranchName|1': ['福州','上海','北京','石家庄'],
            'phone':/^1[0-9]{10}$/
        }]
});

};

在biz/mine.js中加入

if(useMock){
    require('../.././mockTest/xxx')(app);
}

在biz/common/config.js中加入

    window.useMock = true;//使用 mockjs

开启使用mockjs,如果不使用mockjs,将window.useMock设置为false

mockjs模拟ajax请求时间

Mock.setup({
    timeout: 400
})
Mock.setup({
    timeout: '200-600'
})

详细的mockjs使用可参考:
mockjs api文档
mockjs 官网

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值