mock.js-无需等待,让前端独立于后端进行开发
入门资料:https://www.cnblogs.com/CyLee/p/6072399.html
进阶资料: https://www.cnblogs.com/Leo_wl/p/6693211.html
vue使用:https://www.cnblogs.com/jasonwang2y60/p/7302449.html
下面代码的下载链接:https://pan.baidu.com/s/1pMQ4M8N 密码:pdj2:<script src="jquery.js" ></script>
<script src="mock-min.js" ></script> <script> var Random = Mock.Random;//用于图片 var data = Mock.mock({ 'list|4': [{ 'image': Random.image('200x200', '#50B347', '#FFF', 'Mock.js'), 'date': '@date("yyyy-MM-dd HH:mm:ss")', 'date2': '@dateTime', 'ctitle': '@ctitle(8)',//中文前面加c 'canme': '@cname()', 'cadd': '@province' + '@city' + '@county', 'phone': /^1[385][1-9]\d{8}/ }] }); var z = JSON.stringify(data,null,4); console.log(z); //哦哦,明白了,有地址返回的就是对象。上面的列子Mock.mock("有地址,就是监听ajax没有就是返回数据",function(){}); var t = Mock.mock('http://123.com',{ 'name|3':'fei', 'name2|1-3':'fei', 'age2|1':true, 'age3|5':true, 'id|+1': 1, 'number|1-10': 7, 'name' :'@name', 'color': '@color', 'title': '@title', 'url': '@url("http")', 'email': '@email', }) $.ajax({ url:'http://123.com', dataType:'json', success:function(e){ console.log(e) } }) </script>
写法2:
// Mock.mock( rurl, rtype, template )
Mock.mock(/\.json/, 'get', {
type: 'get'
})
Mock.mock(/\.json/, 'post', {
type: 'post'
})
$.ajax({
url: 'hello.json',
type: 'get',
dataType: 'json'
}).done(function (data, status, jqXHR) {
$('<pre>').text(JSON.stringify(data, null, 4))
.appendTo('body')
})
$.ajax({
url: 'hello.json',
type: 'post',
dataType: 'json'
}).done(function (data, status, jqXHR) {
$('<pre>').text(JSON.stringify(data, null, 4))
.appendTo('body')
})