VUE——本地mock資料並請求
阿新 • • 發佈:2019-01-28
在src統計目錄下新建data.json檔案
{ "clock":{ "normal":{ "rule":[ { "id":1, "onWorkTime":"09:00", "afterWorkTime":"12:00" }, { "id":2, "onWorkTime":"13:00", "afterWorkTime":"18:00" } ], "data":{ "onWorkTime":1533540512000, "afterWorkTime":1533550140000 } }, "outer":{ "records":[ { "id":1, "clockTime":1533540512000, "address":"上海市新華路128號", "note":"外出拜訪客戶" } ] } } }
在build資料夾的webpack.dev.conf.js檔案中 const portfinder = require("portfinder");下面宣告並定義API
const express = require("express"); const app = express(); const appData = require("../data.json"); // 載入本地json檔案 const clock = appData.clock; // 獲取對應本地資料 const apiRoutes = express.Router(); app.use("/api", apiRoutes);
在devServer裡面新增:
before(app) {
app.get("/api/clock", (reg, res) => {
res.json({
code: 0,
data: clock
}); // 介面返回json資料,上面配置的資料seller就複製給data請求後呼叫
});
}
即可通過以下訪問:
this.$axios.get("/api/clock").then(res => { console.log(res); });