本文主要和大家分享mockjs的常用方法,結合文字和代碼和大家講解,希望能幫助到大家。
一.mock.mock()
根據數據模板生成模擬數據。更關鍵的是,我們發起Ajax請求的時候要能夠接收到這些數據。這就是Mock.mock()的作用啦!
Mock.mock( rurl?, rtype?, template|function( options ) )
(1).參數的含義和默認值
參數 rurl:可選。表示需要攔截的 URL,可以是 URL 字符串或 URL 正則。例如 /\/domain\/list.json/、'/domian/list.json'。
參數 rtype:可選。表示需要攔截的 Ajax 請求類型。例如 GET、POST、PUT、DELETE 等。
參數 template:可選。表示數據模板,可以是對象或字符串。例如 { 'data|1-10':[{}] }、'@EMAIL'。
參數 function(options):可選。表示用于生成響應數據的函數。
參數 options:指向本次請求的 Ajax 選項集。
(2).方法
2.Mock.mock( template ) 根據數據模板生成模擬數據
3.Mock.mock( rurl, template )
記錄數據模板。當攔截到匹配 rurl 的 Ajax 請求時,將根據數據模板 template 生成模擬數據,并作為響應數據返回。
4.Mock.mock( rurl, function( options ) )
記錄用于生成響應數據的函數。當攔截到匹配 rurl 的 Ajax 請求時,函數 function(options) 將被執行,并把執行結果作為響應數據返回。
5.Mock.mock( rurl, rtype, template )
記錄數據模板。當攔截到匹配 rurl 和 rtype 的 Ajax 請求時,將根據數據模板 template 生成模擬數據,并作為響應數據返回。
7.Mock.mock( rurl, rtype, function( options ) )
記錄用于生成響應數據的函數。當攔截到匹配 rurl 和 rtype 的 Ajax 請求時,函數 function(options) 將被執行,并把執行結果作為響應數據返回。
(3).列子var data8 = Mock.mock(/\.json/,"get",{
"name":"@name",
"isTrue|1":true,
"color":"@color"
})
Mock.mock(/\.json/, 'post', function(options) {
return options.type
})
$.ajax({
url: 'hello.json',
type: 'get',
dataType: 'json'
}).done(function (data, status, jqXHR) {
$('
').text(JSON.stringify(data, null, 4))
.appendTo('body')
})
$.ajax({
url: 'hello.json',
type: 'post',
dataType: 'json'
}).done(function (data, status, jqXHR) {
$('
').text(JSON.stringify(data, null, 4))
.appendTo('body')
})
查看官網列子
二.Mock.Random
Mock.Random 是一個工具類,用于生成各種隨機數據
(1).基本使用
1.Mock.Random.boolean() 返回一個隨機的布爾值。
2.Random.natural() 返回一個隨機的自然數(大于等于 0 的整數)
3.Random.integer()返回一個隨機的整數。
4.Random.float()返回一個隨機的浮點數。
5.Random.character()返回一個隨機字符。
6.Random.string()返回一個隨機字符串
7.Random.range( start?, stop, step? )返回一個整型數組。
查看官網
(2).日期+時間
1.日期
Random.date() "2002-10-23"
Random.date('yyyy-MM-dd') // "1975-04-27"
Random.date('yy-MM-dd') // "00-01-08"
2.時間:
Random.time() // "05:06:06"
3.日期和時間
Random.datetime('yyyy-MM-dd A HH:mm:ss')
4.當前的日期和時間 Ranndom.now()
(3).模擬Web數據
(4).模擬地理位置數據
(5).顏色+文本+姓氏(名字)
請查看官網
三.Mock.valid( template, data )
校驗真實數據 data 是否與數據模板 template 匹配。
template 必選。 表示數據模板,可以是對象或字符串。例如 { 'list|1-10':[{}] }、'@EMAIL'。
data 必選。 表示真實數據。
eg:var template = {
name: 'value1'
}
var data = {
name: 'value2'
}
Mock.valid(template, data)
// =>
[
{
"path": [
"data",
"name"
],
"type": "value",
"actual": "value2",
"expected": "value1",
"action": "equal to",
"message": "[VALUE] Expect ROOT.name'value is equal to value1, but is value2"
}
]
四.Mock.toJSONSchema( template )
把 Mock.js 風格的數據模板 template 轉換成 JSON Schema。
五.Mock.setup()
Mock.setup( settings ) 配置攔截 Ajax 請求時的行為。支持的配置項有:timeout。參數的含義和默認值
settings 必選。配置項集合。
timeout 可選。
指定被攔截的 Ajax 請求的響應時間,單位是毫秒。值可以是正整數,例如 400,表示 400 毫秒 后才會返回響應內容;也可以是橫杠 '-' 風格的字符串,例如 '200-600',表示響應時間介于 200 和 600 毫秒之間。默認值是'10-100'。
Mock.setup({
timeout: 400
})
Mock.setup({
timeout: '200-600'
})
目前,接口 Mock.setup( settings ) 僅用于配置 Ajax 請求,將來可能用于配置 Mock 的其他行為。