Vue是一个MVVM模式的前端框架,在vue的开发过程当中能够使用mock数据来模拟实际状况,能够经过express在vue-cli中的build/dev-server.js下搭建一个后端服务器经过读取本地的json文件,为前端提供数据,前端经过vue-resource插件中的ajax方式获取数据。
因为一个json文件中能够有多种数据,分为多个模块,因此这里采用express.router来实现不一样路径对应不一样数据。html
相关文档:[http://www.expressjs.com.cn/guide/routing.html][1]
1.在vue-cli本地存在一个json格式的数据文件前端
2.在build/dev-server.js下搭建一个服务器vue
var express = require('express'); var app = express() var appData = require('../db.json')//引入文件 var getOrderList = appData.getOrderList//json数据模块 var getNewsList = appData.getNewsList//数据模块 var apiRouters = express.Router()//定义router apiRouters.get('/getOrderList',function (req, res) { res.json({ errno: 0,//返回值为json格式,效验码编程时方便判断返回状态 data: getOrderList }); }) apiRouters.get('/getNewsList',function (req, res) { res.json({ errno: 0, data: getNewsList }) }) app.use('/apis', apiRouters)//域名下的访问路径
3.这样就实现了mock数据的创建,经过‘当前域名’+apis/XXXX获取,也能够经过vue-resource插件中的this.$http.get('url').then()获取ajax