有时候web前端需要一些假数据来进行模拟后台数据。基于vue-cli,我们就来演示一下如何模拟假数据,用到了 express,和 express.Router、
依旧废话不多说,直接上代码。
存放json文件
json文件内容例如(自己随便写的):
{
"seller":{
text:"我是seller"
},
"goods":{
text:"我是goods"
},
"ratings":{
text:"我是ratings"
}
}
需要在build里面修改一下dev-server文件:
然后进行修改文件:
//导入data.json文件
const appData = require("../data.json");
//存一下数据
const seller = appData.seller;
const goods = appData.goods;
const ratings = appData.ratings;
//创建express路由
const apiRoutes = express.Router();
//用路由接受一下 这里的/seller就是访问的地址
apiRoutes.get("/seller",(req,res)=>{
res.json({
errorNo:0,
seller
});
});
apiRoutes.get("/goods",(req,res)=>{
res.json({
errorNo:0,
goods
});
});
apiRoutes.get("/ratings",(req,res)=>{
res.json({
errorNo:0,
ratings
});
});
//这里需要用一下 "/api"这里是就在api/seller
app.use("/api",apiRoutes);
重新 npm run dev
按着下图访问 就能访问到数据了(我这里是在谷歌商店上安装了读取json文件的插件,如果有兴趣的小伙伴也可以去安装一下,很强大,麻麻再也不用担心我看json文件咪眼睛了...)