關於vue專案中使用mockjs mock資料

2021-10-10 16:19:08 字數 1390 閱讀 2985

npm install -d mockjs
2.新建mock.js資料夾 可以在src目錄下

// mock.js

// 引入mockjs

const mock = require('mockjs')

// 獲取 mock.random 物件

const random = mock.random

// mock新聞資料,包括新聞標題title、內容content、建立時間createdtime

const producenewsdata = function ()

newslist.push(newnewsobject)

} return newslist

}// 請求該url,就可以返回newslist

mock.mock('/mock/news', producenewsdata) // 後面講這個api的使用細節

3.在main.js資料夾中引入mock.js

// main.js

import vue from 'vue'

import router from './router'

require(./mock.js)

4.在vue資料夾中使用

4.關於mock的一些簡單引數

mock.mock( rurl, rtype, template|function( options ) )

rurl

可選。表示需要攔截的 url,可以是 url 字串或 url 正則。例如 '/domian/list.json'。

rtype

可選。表示需要攔截的 ajax 請求型別。例如 get、post、put、delete 等。

template

可選。表示資料模板,可以是物件或字串。

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

// 屬性名 name

// 生成規則 rule

// 屬性值 value

'name|rule': value

例如:'name|1-10':1 會產生乙個1-10之間的整數,詳細規則參見官方文件

function(options)

可選。表示用於生成響應資料的函式。

options

指向本次請求的 ajax 選項集,含有 url、type 和 body 三個屬性

vue專案中使用jQuery

這裡是引入全域性的jquery 1.在package.json檔案中,devdependencies 物件中新增 jquery 3.1.1 2.在build資料夾下的webpack.base.conf.js檔案中新增 var webpack require webpack 增加乙個plugins p...

vue 專案中使用 jquery

在 vue 專案中使用 jquery,具體步驟如下 1 npm 安裝 jquery 命令如下,後邊指定安裝的 jquery 版本 npm install jquery 3.2.1不加 會安裝最新版本 npm install jquery命令執行成功後,會在 package.json 檔案中自動生成 ...

vue專案中使用mui

vue搭建環境 hbuilder編輯器。我不喜歡用hbuilder寫 在使用vscode 使用的是vue cli腳手架。這個就不多bb了,之後對檔案做了簡單的調整。還是直接貼圖吧 基本的頁面準備工作完成assetspublicpath 之前是 改為 使build之後的專案能在本地執行 product...