Vue2.0练手项目开发笔记-1、请求本地数据的接口

因为是一个练手项目,所以访问的数据是本地的data.json

在项目文件中找到以下js文件:

build文件->webpack.dev.conf.js

const portfinder = require('portfinder')

在这句下面添加以下代码:

const express = require('express')
const app = express()

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

const apiRoutes = express.Router()
app.use('/api',apiRoutes)

其中seller、goods、ratings都是在data.json中的数据

然后在devServer内添加以下代码:

before(app) {
  app.get('/api/ratings',(req, res) => {
    res.json({
      errno: 0,
      data: ratings
    })
  }),
  app.get('/api/seller',(req,res) =>{
    res.json({
      errno: 0,
      data: seller
    })
  }),
    app.get('/api/goods',(req,res) =>{
      res.json({
        errno: 0,
        data: goods
      })
    })
},

最后重新运行npm

再访问以下三个地址:

http://localhost:8080/api/ratings

http://localhost:8080/api/seller

http://localhost:8080/api/goods

能显示data.json中的相应数据了



你可能感兴趣的:(Vue)