Mock，前端mock数据的神器

相信有不少小伙伴在开发的时候遇到过这样的问题：静态页面写好了，就等后端给数据了！WTF?我刚写好代码你告诉我后端的接口又变了！什么破网啊根本访问不到服务器啊…css

这个时候就须要前端神器Mock.js了(妈妈不再怕我和后端撕逼了)前端

安装

$npm install mock.js

模拟数据

Mock.mock(template)

Mock.mock(rurl,function(options))

Mock.mock(rurl,rtype,template)

Mock.mock(rurl,rtype,function(options))

• template表示数据模板，能够是{'data|1-10':[{}]}也能够是’@EMAIL’
• rurl表示要拦截的地址，可使普通的url如http://c.cn，也能够是url正则表达式/\.json/
• rtype表示须要拦截的 Ajax 请求类型。例如 GET、POST、PUT、DELETE 等。
• funtion(options)表示用于生成响应数据的函数。

举个栗子：jquery

//<script src="//cdn.bootcss.com/jquery/2.2.4/jquery.js"></script> //<script src="http://mockjs.com/dist/mock.js"></script>
Mock.mock(/\.json/, {
    'list|1-10': [{
        'id|+1': 1,
        'email': '@EMAIL'
    }]
})

$.ajax({
    url: 'hello.json',
    dataType: 'json'
}).done(function (data, status, jqXHR) {
    console.table(data)
})