Mock.mock()

官方文檔

https://github.com/nuysoft/Mock/wiki

Mock.mock()

1. Mock.mock( template )

根據(jù)數(shù)據(jù)模板生成模擬數(shù)據(jù)。

<!-- (必選)加載 Mock -->
<script src="http://mockjs.com/dist/mock.js"></script>
<script>
var template = {
    'title': 'Syntax Demo',

    'string1|1-10': '★',
    'string2|3': 'value',

    'number1|+1': 100,
    'number2|1-100': 100,
    'number3|1-100.1-10': 1,
    'number4|123.1-10': 1,
    'number5|123.3': 1,
    'number6|123.10': 1.123,

    'boolean1|1': true,
    'boolean2|1-2': true,

    'object1|2-4': {
        '110000': '北京市',
        '120000': '天津市',
        '130000': '河北省',
        '140000': '山西省'
    },
    'object2|2': {
        '310000': '上海市',
        '320000': '江蘇省',
        '330000': '浙江省',
        '340000': '安徽省'
    },

    'array1|1': ['AMD', 'CMD', 'KMD', 'UMD'],
    'array2|1-10': ['Mock.js'],
    'array3|3': ['Mock.js'],

    'function': function() {
        return this.title
    }
}
var data = Mock.mock(template)

$('<pre>').text(JSON.stringify(data, null, 4))
    .appendTo('body')
</script>
image

2. Mock.mock( rurl, template )

記錄數(shù)據(jù)模板圃阳。當(dāng)攔截到匹配 rurl 的 Ajax 請求時(shí),將根據(jù)數(shù)據(jù)模板 template 生成模擬數(shù)據(jù)卤材,并作為響應(yīng)數(shù)據(jù)返回相满。

<!-- (必選)加載 Mock -->
<script src="http://mockjs.com/dist/mock.js"></script>
// Mock.mock(rurl, template)
Mock.mock(/\.json/, {
    'list|1-10': [{
        'id|+1': 1,//屬性 id 是一個(gè)自增數(shù),起始值為 1,每次增 1
        'email': '@EMAIL'//隨機(jī)郵箱地址
    }]
})
$.ajax({
    url: 'hello.json',
    dataType: 'json'
}).done(function(data, status, jqXHR){
    $('<pre>').text(JSON.stringify(data, null, 4))
        .appendTo('body')
})
image

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

記錄用于生成響應(yīng)數(shù)據(jù)的函數(shù)烟号。當(dāng)攔截到匹配 rurl 的 Ajax 請求時(shí),函數(shù) function(options) 將被執(zhí)行政恍,并把執(zhí)行結(jié)果作為響應(yīng)數(shù)據(jù)返回汪拥。

// Mock.mock(rurl, function(options))
Mock.mock(/\.json/, function(options) {
    return options
})
$.ajax({
    url: 'hello.json',
    dataType: 'json'
}).done(function(data, status, jqXHR) {
    $('<pre>').text(JSON.stringify(data, null, 4))
        .appendTo('body')
})
$.ajax({
    url: 'hello.json',
    dataType: 'json',
    data: {
        foo: 1,
        bar: 2,
        faz: 3
    }
}).done(function(data, status, jqXHR) {
    $('<pre>').text(JSON.stringify(data, null, 4))
        .appendTo('body')
})
$.ajax({
    url: 'hello.json',
    type: 'post',
    dataType: 'json',
    data: {
        foo: 1,
        bar: 2,
        faz: 3
    }
}).done(function(data, status, jqXHR) {
    $('<pre>').text(JSON.stringify(data, null, 4))
        .appendTo('body')
})
image

4. Mock.mock( rurl, rtype, template )

記錄數(shù)據(jù)模板。當(dāng)攔截到匹配 rurl 和 rtype 的 Ajax 請求時(shí)篙耗,將根據(jù)數(shù)據(jù)模板 template 生成模擬數(shù)據(jù)迫筑,并作為響應(yīng)數(shù)據(jù)返回。

// 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')
})
image

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

記錄用于生成響應(yīng)數(shù)據(jù)的函數(shù)宗弯。當(dāng)攔截到匹配 rurl 和 rtype 的 Ajax 請求時(shí)脯燃,函數(shù) function(options) 將被執(zhí)行,并把執(zhí)行結(jié)果作為響應(yīng)數(shù)據(jù)返回蒙保。

// Mock.mock( rurl, rtype, function(options) )
Mock.mock(/\.json/, 'get', function(options) {
    return options.type
})
Mock.mock(/\.json/, 'post', function(options) {
    return options.type
})

$.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')
})
image

參數(shù)

1. rurl辕棚,可選。

表示需要攔截的 URL,可以是 URL 字符串或 URL 正則逝嚎。例如 //domain/list.json/扁瓢、'/domian/list.json'。

Mock.mock(/\/proxy\/query_common_credit/, {//匹配所有包含/proxy/query_common_credit的url
    "ret":0,
    "data":
      {
        "mtime": "@datetime",//隨機(jī)生成日期時(shí)間
        "score":  "@natural(1, 800)",//隨機(jī)生成1-800的數(shù)字
        "rank":  "@natural(1, 100)",//隨機(jī)生成1-100的數(shù)字
        "stars": "@natural(0, 5)",//隨機(jī)生成1-5的數(shù)字
        "nickname": "@cname",//隨機(jī)生成中文名字
      }
});

2. rtype补君,可選引几。

表示需要攔截的 Ajax 請求類型。例如 GET挽铁、POST伟桅、PUT、DELETE 等屿储。

3. template贿讹,可選。

表示數(shù)據(jù)模板够掠,可以是對(duì)象或字符串民褂。例如 { 'data|1-10':[{}] }、'@EMAIL'疯潭。

4. function(options)赊堪,可選。

表示用于生成響應(yīng)數(shù)據(jù)的函數(shù)竖哩。

5. options

指向本次請求的 Ajax 選項(xiàng)集哭廉,含有 url、type 和 body 三個(gè)屬性相叁,參見 XMLHttpRequest 規(guī)范遵绰。

從 1.0 開始,Mock.js 通過覆蓋和模擬原生 XMLHttpRequest 的行為來攔截 Ajax 請求增淹,不再依賴于第三方 Ajax 工具庫(例如 jQuery椿访、Zepto 等)。

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末虑润,一起剝皮案震驚了整個(gè)濱河市成玫,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌拳喻,老刑警劉巖哭当,帶你破解...
    沈念sama閱讀 216,843評(píng)論 6 502
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異冗澈,居然都是意外死亡钦勘,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,538評(píng)論 3 392
  • 文/潘曉璐 我一進(jìn)店門亚亲,熙熙樓的掌柜王于貴愁眉苦臉地迎上來个盆,“玉大人脖岛,你說我怎么就攤上這事〖樟粒” “怎么了柴梆?”我有些...
    開封第一講書人閱讀 163,187評(píng)論 0 353
  • 文/不壞的土叔 我叫張陵,是天一觀的道長终惑。 經(jīng)常有香客問我绍在,道長,這世上最難降的妖魔是什么雹有? 我笑而不...
    開封第一講書人閱讀 58,264評(píng)論 1 292
  • 正文 為了忘掉前任偿渡,我火速辦了婚禮,結(jié)果婚禮上霸奕,老公的妹妹穿的比我還像新娘溜宽。我一直安慰自己,他們只是感情好质帅,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,289評(píng)論 6 390
  • 文/花漫 我一把揭開白布适揉。 她就那樣靜靜地躺著,像睡著了一般煤惩。 火紅的嫁衣襯著肌膚如雪嫉嘀。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 51,231評(píng)論 1 299
  • 那天魄揉,我揣著相機(jī)與錄音剪侮,去河邊找鬼。 笑死洛退,一個(gè)胖子當(dāng)著我的面吹牛瓣俯,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播兵怯,決...
    沈念sama閱讀 40,116評(píng)論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼降铸,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了摇零?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 38,945評(píng)論 0 275
  • 序言:老撾萬榮一對(duì)情侶失蹤桶蝎,失蹤者是張志新(化名)和其女友劉穎驻仅,沒想到半個(gè)月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體登渣,經(jīng)...
    沈念sama閱讀 45,367評(píng)論 1 313
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡噪服,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,581評(píng)論 2 333
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了胜茧。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片粘优。...
    茶點(diǎn)故事閱讀 39,754評(píng)論 1 348
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡仇味,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出雹顺,到底是詐尸還是另有隱情丹墨,我是刑警寧澤,帶...
    沈念sama閱讀 35,458評(píng)論 5 344
  • 正文 年R本政府宣布嬉愧,位于F島的核電站贩挣,受9級(jí)特大地震影響,放射性物質(zhì)發(fā)生泄漏没酣。R本人自食惡果不足惜王财,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,068評(píng)論 3 327
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望裕便。 院中可真熱鬧绒净,春花似錦、人聲如沸偿衰。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,692評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽哎垦。三九已至囱嫩,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間漏设,已是汗流浹背墨闲。 一陣腳步聲響...
    開封第一講書人閱讀 32,842評(píng)論 1 269
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留郑口,地道東北人鸳碧。 一個(gè)月前我還...
    沈念sama閱讀 47,797評(píng)論 2 369
  • 正文 我出身青樓,卻偏偏與公主長得像犬性,于是被迫代替她去往敵國和親瞻离。 傳聞我的和親對(duì)象是個(gè)殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,654評(píng)論 2 354

推薦閱讀更多精彩內(nèi)容