1. 在webpack.dev.conf.js 里面找到 const portfinder = require(‘portfinder’),然后在下面写上以下代码：
//添加mock数据
//node.js开发框架express，用来简化操作
const express = require('express');
//创建node.js的express开发框架的实例
const app = express();
//加载本地的json地址
var appData = require('../db.json');
var apiRoutes = express.Router();
app.use('/api',apiRoutes);
接着，找到 devServer 的选项，在其｛｝里面补上一下代码：
//添加mock接口数据
before(app) {
app.get('/api/appData',(req, res) => {
res.json({
data: appData
})//接口返回json数据，上面配置的数据appData就赋值给data请求后调用
})
}
操作如下图：
2. 接着创建一个 db.json 文件。（目录自己设置就行）
注意：不管用get或者post方法，每个数据都得加上一个id（即使后面不需要用到），如果不加的话，运行项目（cnpm run dev）的时候会报错。
3. 接着配置 .vue 文件。
export default {} 里面写上一下代码，并且记得在data里面补上数组的名字：
created: function () {
this.$http.get('/api/appData')
.then( (res) => {
// console.log(res.data);
this.infor = res.body.data.appData;
}, (req) => {
console.log(req)
})
}
接着在 template 标签里面用 v-for 将数据渲染出来：（下面只是举个例子）
接着在 template 标签里面用 v-for 将数据渲染出来：（下面只是举个例子）
4. 配置完成后需要用命令重新启动项目
cnpm run dev
5. 效果图如下：
6. 数据成功渲染到页面上，也就是说模拟数据成功！