我們在使用vue寫前端專案的時候，可能會需要後端傳回來的資料來進行測試。但是有的時候我們沒有後端的環境，不能獲取到我們想要的資料。這個時候我們就需要在vue專案中設定一些假資料，即mock資料。
配置完成之後，我們就可以像請求後台資料一樣，通過乙個特定的url來獲取到我們需要的mock資料，比如:/api/goods、/api/ratings等。
今天就跟大家分享如何在自己的vue專案中設定mock資料。需要注意的是，我現在使用的是vue2.x版本，不過我想vue3.x版本應該也是大同小異。
。除此之外我們就不需要額外準備其他的資料了，我們設定mock資料，主要是依靠webpack給我們自動安裝的express元件，而且設定這些資料的時候，只需要在build資料夾下的webpack.dev.conf.js檔案中。
我們首先應該引入express元件和data.json資料檔案，具體**如下：
const express =
require
('express'
)express()
const apiroutes = express.
router()
require
('../data.json'
)use
('api'
, apiroutes)
給這個物件新增乙個方法，具體的**如下：
before)}
),get(
'/api/goods'
,(req, res)
=>)}
),get(
'/api/ratings'
,(req, res)
=>)}
)}
errno和datajson物件，如果如果你還想讓這些mock資料返回更多的東西，可以在errno和data之後新增新的屬性。
例如你想通過/api/seller返回message："這些是商家資料"這條資訊，可以這樣改寫：
before)}
)
npm run dev來重啟我們的vue專案（注意這裡一定要重新啟動，修改這些配置不會觸發熱載入），然後通過我們配置的api來獲取mock資料。
vue專案中使用mock
1 src下新建mock資料夾,mock資料夾下新建response目錄 造後台介面資料，輸出getuserinfo import mock from mockjs const random mock.random export const getuserinfo options userinfo....
在vue專案中, mock資料
1.在根目錄下建立 test 目錄,用來存放模擬的 json 資料,在 test 目錄下建立模擬的資料 data.json 檔案 2.在build目錄下的 dev server.js的檔案作如下更改 3.在.vue做請求,就可以成功獲取data.json的資料了,下面使用 axios 進行請求axi...
在vue專案中mock的使用
模擬後台介面，提供頁面需要的資料。使用例子 使用 mock var mock require mockjs var data mock.mock 輸出結果 console.log json stringify data 資料模板中的每個屬性由3部分構成 name rule value 屬性名 生成規...