理解mockjs並且怎麼去使用mockjs

2021-10-10 19:41:19 字數 3014 閱讀 4589

生成隨機資料,攔截 ajax 請求

在做開發時,當後端的介面還未完成,前端為了不影響工作效率,手動模擬後端介面,

1.我們可以使用json檔案來模擬後台資料,但比較侷限,無法模擬資料的增刪改查

2.使用json-server模擬,但不能隨機生成所需資料

3.使用mockjs模擬後端介面,可隨機生成所需資料,可模擬對資料的增刪改查

1.前後端分離,

2.可隨機生成大量的資料

3.用法簡單

4.資料型別豐富

5.可擴充套件資料型別

6.在已有介面文件的情況下,我們可以直接按照介面文件來開發,將相應的字段寫好,在介面完成 之後,只需要改變url位址即可。

1.安裝mockjs
npm install mockjs
2.使用前先要了解mockjs的語法規範

mock.js 的語法規範包括兩部分:

2.1. 資料模板定義規範(data template definition,dtd)

資料模板中的每個屬性由 3 部分構成:屬性名、生成規則、屬性值:

// 屬性名 name

// 生成規則 rule

// 屬性值 value

『name|rule』: value

注意:

生成規則和示例:

1. 屬性值是字串 string

'name|min-max': string

通過重複 string 生成乙個字串,重複次數大於等於 min,小於等於 max。

'name|count': string

通過重複 string 生成乙個字串,重複次數等於 count。

2. 屬性值是數字 number

'name|+1': number

屬性值自動加 1,初始值為 number。
'name|min-max': number

生成乙個大於等於 min、小於等於 max 的整數,屬性值 number 只是用來確定型別。

'name|min-max.dmin-dmax': number

生成乙個浮點數,整數部分大於等於 min、小於等於 max,小數部分保留 dmin 到 dmax 位。

mock.

mock()

// =>

3. 屬性值是布林型 boolean

'name|1': boolean

隨機生成乙個布林值,值為 true 的概率是 1/2,值為 false 的概率同樣是 1/2。

'name|min-max': value

隨機生成乙個布林值,值為 value 的概率是 min / (min + max),值為 !value 的概率是 max / (min + max)。

4. 屬性值是物件 object

'name|count': object

從屬性值 object 中隨機選取 count 個屬性。

'name|min-max': object

從屬性值 object 中隨機選取 min 到 max 個屬性。

5. 屬性值是陣列 array

'name|1': array

從屬性值 array 中隨機選取 1 個元素,作為最終值。

'name|+1': array

從屬性值 array 中順序選取 1 個元素,作為最終值。

'name|min-max': array

通過重複屬性值 array 生成乙個新陣列,重複次數大於等於 min,小於等於 max。

'name|count': array

通過重複屬性值 array 生成乙個新陣列,重複次數為 count。

6. 屬性值是函式 function

'name': function

執行函式 function,取其返回值作為最終的屬性值,函式的上下文為屬性 『name』 所在的物件。

7. 屬性值是正規表示式 regexp

'name': regexp

根據正規表示式 regexp 反向生成可以匹配它的字串。用於生成自定義格式的字串。

mock.

mock(/

})// =>

2.2. 資料佔位符定義規範 dpd

佔位符 只是在屬性值字串中占個位置,並不出現在最終的屬性值中。

佔位符 的格式為:

@佔位符

@佔位符(引數 [, 引數])

注意:

用 @ 來標識其後的字串是 佔位符。

佔位符 引用的是 mock.random 中的方法。

通過 mock.random.extend() 來擴充套件自定義佔位符。

佔位符 也可以引用 資料模板 中的屬性。

佔位符 會優先引用 資料模板 中的屬性。

佔位符 支援 相對路徑 和 絕對路徑。

mock.

mock(}

)// =>

}

vs庫的除錯,使用dll怎麼去除錯

有時候,我們製作的是dll的庫,但是這樣卻不方便自己去調式,可以通過三種方式來進行選擇 一 自己寫乙個main函式的控制台程式,然後在main函式中進行呼叫封裝好的介面 函式 來進行呼叫測試 第二種參考部落格 二 如果將介面和dll部分剝離開來的話,進行dll和介面的開發時,可以開啟控制台,這樣在除...

坑爹的JS閉包,怎麼去理解才是正確的

有好些天沒寫文章了,前面一直在搭建自己的部落格後台,由於網域名稱備案一直沒有下來,就只能繼續在這裡寫了。今天寫些什麼了,一般大家比較關心,尤其學js的,就是又愛又恨的乙個概念 閉包。說了這麼多,那麼閉包的定義到底是什麼了。大家一定要注意,不是說能夠訪問到其他作用域的變數就是閉包,這是很籠統的。準確來...

ajax是什麼?為什麼使用?怎麼理解?

要學習一門市 技術之前,首先我們要了解一下他是什麼,為什麼使用,有什麼好處,該怎麼理解。現在就從下文開始了解吧 應用程式的大多數處理在使用者的瀏覽器中發生,而且對伺服器的資料請求往往很短。所以可以使用ajax建立功能豐富的應用程式,這些應用程式依賴基於web的資料,但是其效能遠遠超過老式的,因為老式...