Vue是一个MVVM模式的前端框架,在vue的开发过程中可以使用mock数据来模拟实际情况,可以通过express在vue-cli中的build/dev-server.js下搭建一个后端服务器通过读取本地的json文件,为前端提供数据,前端通过vue-resource插件中的ajax方式获取数据。
由于一个json文件中可以有多种数据,分为多个模块,所以这里采用express.router来实现不同路径对应不同数据。相关文档:[http://www.expressjs.com.cn/guide/routing.html][1]
1.在vue-cli本地存在一个json格式的数据文件
2.在build/dev-server.js下搭建一个服务器
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()//定义routerapiRouters.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()获取