使用mock.js的一些体会 （1）

首先免不了安装了

# 安装 npm方式
npm install mockjs

# 安装  bower
npm install -g bower
bower install --save mockjs

#CDN方式引入（找一找网上的cdn服务商提供）

  <script src="https://cdn.bootcdn.net/ajax/libs/Mock.js/1.0.1-beta3/mock-min.js"></script> 

 

先来一个最简单的例子

        Mock.mock('www.haizhi.com', {

            "user|2-5": [{ //2-5组数据

                'name': '@cname', //中文名称

                'age|1-100': 100, //100以内随机整数

            }]

        });

        Mock.setup({

            timeout: '200-600'

        })

        var xhr = new XMLHttpRequest();

        xhr.open("get", "www.haizhi.com", true);

        xhr.send(null);

        xhr.onreadystatechange = function () {

            if (xhr.readyState == 4 && xhr.status == 200) {

                console.log(xhr.responseText);

            }

        }

浏览器上看下效果：

 

 

 

 

 

接下来讲一下他的使用：

1.Mock.mock( rurl?, rtype?, template|function( options ) )

1.1 Mock.mock( template )

根据数据模板生成模拟数据。

1.2 Mock.mock( rurl, template )

记录数据模板。当拦截到匹配 rurl 的 Ajax 请求时，将根据数据模板 template 生成模拟数据，并作为响应数据返回。（这个比较常用）

-----------------先介绍以上这两个-------------------------

rurl

表示需要拦截的 URL，可以是 URL 字符串或 URL 正则。例如 /\/domain\/list\.json/、'/domian/list.json'。

template

可选。

表示数据模板，可以是对象或字符串。例如 { 'data|1-10':[{}] }、'@EMAIL'。