1. 程式人生 > >vue cli 3.0 專案使用介面連結mock資料

vue cli 3.0 專案使用介面連結mock資料

找到vue.config.js

專案根目錄中存放模擬資料庫,data.json

新增
const appData=require('./data.json')
const seller=appData.seller
const goods=appData.goods
const ratings=appData.ratings

在module.exports = {} 中新增程式碼
devServer:{
      before(app){
          app.get('/api/seller',function(req,res){
              res.json({
                  errno:0,
                  data:seller
              })
          })
          app.get('/api/goods',function(req,res){
              res.json({
                  errno:0,
                  data:goods
              })
          })
          app.get('/api/ratings',function(req,res){
              res.json({
                  errno:0,
                  data:ratings
              })
          })
          
      }
  }


然後執行npm run serve
開啟瀏覽器http://localhost:8080/api/seller
可以看到data.json中seller部分資料。