mock.js实现模拟生成假数据功能示例

mock使用方法很简单, 下面是简单的用法, 详细的用法可以看官方文档, 写的很清楚, 下面的代码直接拷贝到本地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="https://mockjs.com/bower_components/mockjs/dist/mock.js"></script> </head> <body> <script> var Random = Mock.Random; var data = Mock.mock({ 'list|4': [{ 'id|+1': 1, 'number|1-10': 7, // 英文姓名 'name' :'@name', // 颜色 'color': '@color', // 英文标题 'title': '@title', // 链接 'url': '@url("http")', // 邮箱 'email': '@email', // 图片 'image': Random.image('200x200', '#50B347', '#FFF', 'Mock.js'), // 时间 'date': '@date("yyyy-MM-dd HH:mm:ss")', 'date2': '@dateTime', // 汉字 'ctitle': '@ctitle(8)', // 汉字姓名 'canme': '@cname()', // 地址 'cadd': '@province' + '@city' + '@county', // 手机号 'phone': /^1[385][1-9]\d{8}/ }] }); console.log(JSON.stringify(data, null, 4)) </script> </body> </html>

这里使用在线HTML/CSS/JavaScript代码运行工具测试运行上述代码,可得如下运行结果:

mock.js实现模拟生成假数据功能示例

更多关于JavaScript相关内容还可查看本站专题:《javascript面向对象入门教程》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:http://www.heiqu.com/1f867ea9893bd5e19c0f6616ab385c68.html