栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 软件开发 > Web开发 > JavaScript

欢迎了解Mock.js

JavaScript 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

欢迎了解Mock.js

特性
前后端分离

让前端攻城师独立于后端进行开发

增加但愿测试的真实性

通过随机数据,模拟各种场景。

开发无入侵

不需要修改既有代码,就可以拦截 Ajax 请求,返回模拟的响应数据。

用法简单

符合直觉的接口。

数据类型丰富

支持生成随机的文本、数字、布尔值、日期、邮箱、链接、图片、颜色等。

方便扩展

支持支持扩展更多数据类型,支持自定义函数和正则。

开始安装Node(CommonJS)
#  安装npm install mockjs
// 使用 Mockvar Mock = require('mockjs')var data = Mock.mock({    // 属性 list 的值是一个数组,其中含有 1 到 10 个元素
    'list|1-10': [{        // 属性 id 是一个自增数,起始值为 1,每次增 1
        'id|+1': 1
    }]
})// 输出结果console.log(JSON.stringify(data, null, 4))
Bower
#  安装npm install -g bower
bower install --save mockjs
RequireJS (AMD)
// 配置 Mock 路径require.config({    paths: {        mock: 'http://mockjs.com/dist/mock'
    }
})// 加载 Mockrequire(['mock'], function(Mock){    // 使用 Mock
    var data = Mock.mock({        'list|1-10': [{            'id|+1': 1
        }]
    })    // 输出结果
    document.body.innerHTML +=        '
' +        JSON.stringify(data, null, 4) +        '
'})
// ==>{    "list": [
        {            "id": 1
        },
        {            "id": 2
        },
        {            "id": 3
        }
    ]
}
Sea.js (CMD)

因为 Sea.js 社区尚未提供 webpack 插件,所以 Mock.js 暂不完整支持通过 Sea.js 加载。

一种变通的方式是,依然通过 Sea.js 配置和加载 Mock.js,然后访问全局变量 Mock。

// 配置 Mock 路径seajs.config({    alias: {        mock: 'http://mockjs.com/dist/mock.js'
    }
})// 加载 Mockseajs.use('mock', function(__PLACEHOLDER) {    // 使用 Mock(全局变量)
    var data = Mock.mock({        'list|1-10': [{            'id|+1': 1
        }]
    });    document.body.innerHTML +=        '
' +        JSON.stringify(data, null, 4) +        '
'})
Random CLI
# 全局安装$ npm install mockjs -g# 执行$ random url# => http://rmcpx.org/funzwc# 帮助random -h



作者:茹茹茹茹茹茹欧尼_
链接:https://www.jianshu.com/p/7cbf83eff644


转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/247194.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号