使用 mock.js 让前端开发与后端独立
Posted 贝尔塔猫
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了使用 mock.js 让前端开发与后端独立相关的知识,希望对你有一定的参考价值。
直接上代码:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <script src="http://cdn.bootcss.com/jquery/3.1.1/jquery.min.js"></script> <script src="http://mockjs.com/dist/mock.js"></script> </head> <body> <div> <h1 id="mockjs">mockjs</h1> </div> <script type="text/javascript"> //调用mock方法模拟数据 Mock.mock( ‘http://mockjs‘, { "userName" : ‘@name‘, //模拟名称 "age|1-100":100, //模拟年龄(1-100) "color" : "@color", //模拟色值 "date" : "@date(‘yyyy-MM-dd‘)", //模拟时间 "url" : "@url()", //模拟url "content" : "@cparagraph()" //模拟文本 } ); //ajax请求 $("#mockjs").click(function(){ $.ajax({ url : "http://mockjs", //请求的url地址 dataType : "json", //返回格式为json async : true, //请求是否异步,默认为异步,这也是ajax重要特性 data : {}, //参数值 type : "GET", //请求方式 beforeSend : function() { //请求前的处理 }, success: function(req) { //请求成功时处理 console.log(req); }, complete: function() { //请求完成的处理 }, error: function() { //请求出错处理 } }); }); </script> </body> </html>
以上是关于使用 mock.js 让前端开发与后端独立的主要内容,如果未能解决你的问题,请参考以下文章