js根据条件json生成随机json:randomjson
前端开发中,在做前后端分离的时候,经常需要手写json数据,有3个问题特别揪心:
1,数据是写死的,不能按一定的条件随机生成长度不一,内容不一的数据
2,写数组的时候,如果有很多条,需要一条一条地写,费时费力
3,mock图片特别困难
randomjson用来根据模型随机生成json,mock json数据的时候特别有用
先来个例子:http://zhoushengfe.com/random/example/randomjson.html
github地址:
https://github.com/finance-sh/randomjson
如何使用
# randomjson
根据条件生成json对应的随机json
## 如何使用
### 安装
npm install randomjson
或者直接引用产出文件:<script src="dist.js"></script>
### 用法
// 用法
// amd或cmd环境中引用包,浏览器中无需引用
var randomjson = require('randomjson');
// 模型
var modelJson = {
"code": "00",
"numberCode": "<@[10000,20000]>",
"msg": "<@chinese{12,50}>",
"msg2": "<@string{2,3}>",
"logo": "<@image{100,100}>",
"result": {
"pList<@{1,3}>":[
{
"indexToString": "<@index><@>",
"index": "<@index>",
"id": "<@[1-5]>",
"price": "<@float>",
"name": "公司名称<@index>",
"person": "李文武<@index>",
"address": "北京市海淀区西三旗",
"mobile": "1<@number{10}>",
"tel": "<@number{4}>-<@number{8}>",
"list": [
{
"auditKey": 1,
"auditValue": "<@[0,1,2]>"
},
{
"auditKey": 2,
"auditValue": "<@[0,1,2]>"
}
]
}
]
}
}
// 根据模型生成json
var myJson = randomjson(modelJson); 根据上边模型生成的json可能是这样: {
"code": "00",
"numberCode": 10000,
"msg": "加义为边平压你治提用根治问求只或程干立农资特",
"msg2": "dv",
"logo": "https://dummyimage.com/100x100",
"result": {
"pList": [
{
"indexToString": "1",
"index": 1,
"id": 2,
"price": 93.78,
"name": "公司名称1",
"person": "李文武1",
"address": "北京市海淀区西三旗",
"mobile": "17929438781",
"tel": "1148-56055642",
"list": [
{
"auditKey": 1,
"auditValue": 0
},
{
"auditKey": 2,
"auditValue": 1
}
]
},
{
"indexToString": "2",
"index": 2,
"id": 5,
"price": 29.49,
"name": "公司名称2",
"person": "李文武2",
"address": "北京市海淀区西三旗",
"mobile": "17826945504",
"tel": "7298-46226026",
"list": [
{
"auditKey": 1,
"auditValue": 0
},
{
"auditKey": 2,
"auditValue": 0
}
]
}
]
}
}
## 词法
以<@开始,以>结束,中间内容是randomjson的词法
## 模型定义
### 数据类型
"<@number>": number类型
"<@string>": string类型
"<@null>": null
"<@boolean>": boolean类型
"<@chinese>": 中文字符串
"<@float{number1,number2}>": 浮点数 number1代表整数位数,number2代表小数位数,默认都为2
"<@image{width,height}>": 生成图片 width为生成图片宽度,height为生成图片高度,默认为400,400
"<@index>": 元素在数组中的位置,从1开始
### 量词
{minNumber, maxNumber}: minNumber到maxNumber个
{minNumber,}: 最少minNumber
{number}: number个
如果是float,minNumber, maxNumber表示整数部分和小数部分的位数
如果是imgae,minNumber, maxNumber表示图片宽度高度
### 随机生成其中之一
你可以使用“|” 分离多个选项,随机值是其中之一,值为字符串
### 数字范围
[1,2,3] 表示1,2,3中的一个,值为数字
[1-90] 表示1到90中的一个int值,值为数字
### 数字转字符串
在number类型后加空的占位符
"indexToString": "<@index><@>"
### 量词定义注意点
值为非数组时,长度在value字符串里,例如:"ret": "<@number{4}>"
值为数组时,长度在key里,例如:
"p11<@{2,5}>": [{
"p8": "12312",
"p9": ["<@string{4,7}>"],
"p10": "<@string>"
}]
github地址:
https://github.com/finance-sh/randomjson
js根据条件json生成随机json:randomjson的更多相关文章
- 利用纯JS和HTML Canvas生成随机迷宫过程中产生的有趣的事情
上效果图: #先看生成随机迷宫的代码吧↓ <html> <head> <title>生成随机迷宫v1.0</title> </head> & ...
- C#-Newtonsoft.Json生成复杂JSON
官方文档:https://www.newtonsoft.com/json/help/html/SerializeObject.htm 一种方式就可以生成所有的 JSON Collection -> ...
- Web 开发人员必备的随机 JSON 数据生成工具
在 Web 开发中,经常会需要一些测试数据来测试接口或者功能时候正确.JSON Generator 就是这样一款生成随机 JSON 数据的在线工具,Web 开发人员必备,记得收藏和分享啊. 您可能感兴 ...
- 按条件生成j随机json包:randomjson
前端开发中,在做前后端分离的时候,经常需要手写json数据,有2个问题特别揪心: 1,数据是写死的,不能按一定的条件随机生成长度不一,内容不一的数据 2,写数组的时候,如果有很多条,需要一条一条地写, ...
- RandomUser – 生成随机用户 JSON 数据的 API
RandomUser 是一个 API,它为您提供了一个或者一批随机生成的用户.这些用户可以在 Web 应用程序原型中用作占位符,将节省您创建自己的占位符信息的时间.您可以使用 AJAX 或其他方法来调 ...
- json-server 和mock.js生成大量json数据
JSON-server和mock.jsmock文件夹下 db.json db.jsjson-sever使用 安装:npm install json-server -g/mock 目录下执行json-s ...
- js控制json生成菜单——自制菜单(一)
此文档解决以下问题: 1.JSON文件的书写方式 2.jQuery.getJSON()的运用 3.jQuery.each()的运用 4.jQuery的DOM 操作方法之一:.append()的运用 5 ...
- MOCK.JS 生成随机数据,拦截 Ajax 请求
mock.js 的用处 前后端分离 :让前端攻城师独立于后端进行开发. 增加单元测试的真实性 :通过随机数据,模拟各种场景. 开发无侵入 :不需要修改既有代码,就可以拦截 Ajax 请求,返回模拟的响 ...
- JSON生成c#类代码小工具
JSON生成c#类代码小工具 为什么写这么个玩意 最近的项目中需要和一个服务端程序通讯,而通讯的协议是基于流行的json,由于是.net,所以很简单的从公司代码库里找到了Newtonsoft.dll( ...
随机推荐
- libevent学习总结
1. 信息隐藏:看*-internal.h文件 如bufferevent_private结构体在bufferevent_async.c中使用时: static inline struct buffer ...
- 存储过程与SQL语句如何选择
58到家数据库30条军规,有一条是“禁止使用存储过程.视图.触发器.Event”, 高并发大数据的互联网业务,架构设计思路是“解放数据库CPU,将计算转移到服务层”, 并发量大的情况下,这些功能很可能 ...
- [bzoj3196]Tyvj 1730 二逼平衡树——线段树套平衡树
题目 Description 您需要写一种数据结构(可参考题目标题),来维护一个有序数列,其中需要提供以下操作: 1.查询k在区间内的排名 2.查询区间内排名为k的值 3.修改某一位值上的数值 4.查 ...
- 启动genymotion后eclipse不能正常启动adb的处理办法
很多时候在使用genymotion启动后,再在eclipse调试程序会在Console中提示 The connection to adb is down,and a server error has ...
- MegaCli 安装过程
首先说下自己遇到的坑: 百度搜索了一篇关于安装 MegaCli 的文章,于是乎就开始安装,装完之后获取不到 raid 的信息,后来发现是版本问题,就又搜索了一堆文章,最后搞定了 [root@web-0 ...
- TP框架数据库操作(增删改)
首先选择一张表,对其进行操作: 对数据库操作之前首先要创建模型: $n = M("account"); 数据库添加数据: 1.使用数组: 1.使用数组 $arr = array(& ...
- 统计solr multivalued 字段中数目
问题是这样的:已有若干multivalued 字段, 需要统计出 multivalued 字段中数目. 比如 *DOC1* <doc> <arr name="multi&q ...
- aiohttp之添加静态资源路径
所谓静态资源,是指图片.js.css等文件.官方的说明在这里. 以一个小项目来说明,下面是项目的目录结构: . ├── static │ ├── css │ │ ├── base.css │ │ ├─ ...
- React Native 之 项目实战(一)
前言 本文有配套视频,可以酌情观看. 文中内容因各人理解不同,可能会有所偏差,欢迎朋友们联系我. 文中所有内容仅供学习交流之用,不可用于商业用途,如因此引起的相关法律法规责任,与我无关. 如文中内容对 ...
- javascript继承---组合式继承
原型链继承和构造函数继承中存在着很多的缺陷,所以,使用组合式继承了进行弥补这些缺陷 //组合继承 //父函数 function a(){ this.name = "兔子只吃胡萝卜" ...