vue2.0中模拟数据的配置

在开发过程中,有时候接口跟不上我们的进度,我们要测试,就需要自测。

现在vue已经升级到2.0版本了,早期在vue构建工程文件在build里面有dev-server.js,但是后来构建去除了该文件集成到了webpack的webpack.dev.conf.js里面。希望对大家有帮助。

1、先编写模拟数据

 

在本目录配置一个data.json的文件,具体的自己配置,也不难。

2、编写接口模块

进入webpack.dev.conf.js文件,在Number(process.env.PORT)后面写入以下代码:

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

var apiRouter = express.Router()

app.use('/api',apiRouter)
 
再找到同文件下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
})
});
}

 模拟接口配置就已经完成,然后打开cmd,进入项目目录,输入:npm run dev,启动项目

输入:localhost:8080/api/goods

 

posted @ 2018-03-09 10:45  浮生.若梦  阅读(235)  评论(0编辑  收藏  举报