mock.js获取假数据

川长思鸟来 2022-05-14 05:17 162阅读 0赞

直接弄个html，粘贴保存后，用浏览器控制台就能直接看到效果

更多其它示例请访问官网文档：[http://mockjs.com/examples.html][http_mockjs.com_examples.html]

<!DOCTYPE html>
    <html>
    <head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title>MockJS-demo</title>
    <script type="text/javascript" src="http://mockjs.com/bower_components/mockjs/dist/mock.js"></script>
    </head>
    <body>
    <script>
        var Random = Mock.Random;
    	 var obj = {'aa':'11', 'bb':'22', 'cc':'33', 'dd':'44'};
    	 var obj = {'aa':'11', 'bb':'22', 'cc':'33', 'dd':'44'};
    	 var data = Mock.mock({
    		"user|1-3": [{   // 随机生成1到3个数组元素
    			'name': '@cname',  // 中文名称
                'name' :'@name', // 英文姓名
    			'email': '@email', // 邮箱
    			'phone': /^1[385][1-9]\d{8}/, // 手机号
    			'id|+1': 88,    // 属性值自动加 1，初始值为88
    			'url': '@url("http")',// 链接
    			'age|18-28': 0,   // 18至28以内随机整数, 0只是用来确定类型
                'title': '@title', // 英文标题
    			'ctitle': '@ctitle(8)',// 汉字
    			'image': Random.image('200x200', '#50B347', '#FFF', 'Mock.js'),// 图片
    			'birthday': '@date("yyyy-MM-dd")',  // 日期
    			'date': '@date("yyyy-MM-dd HH:mm:ss")',// 时间
    			'date2': '@dateTime',
    			'city': '@city(true)',   // 中国城市
    			'cadd': '@province' + '@county',// 地址
    			'color': '@color',  // 16进制颜色
    			'isMale|1': true,  // 布尔值
    			'isFat|1-2': true,  // true的概率是1/3
    			'fromObj|2': obj,  // 从obj对象中随机获取2个属性
    			'fromObj2|1-3': obj,  // 从obj对象中随机获取1至3个属性
    			'brother|1': ['jack', 'jim'], // 随机选取 1 个元素
    			'sister|+1': ['jack', 'jim', 'lily'], // array中顺序选取元素作为结果
    			'friends|2': ['jack', 'jim'] // 重复2次属性值生成一个新数组
    		}]
    	});
         console.log(JSON.stringify(data, null, 4))
    	 //console.log(data);
    </script>
    </body>
    </html>

[http_mockjs.com_examples.html]: http://mockjs.com/examples.html