vue项目中在本地模拟数据,请求数据步骤
1.先将需要模拟的数据放入mock文件夹中2.在build文件夹中,找到 webpack.dev.conf.js ,我们需要在这个js文件中配置Json//第一步 const portfinder = require('portfinder'),在后面加上const express = require('express');const app = express(); //请求s...
·
1.先将需要模拟的数据放入mock文件夹中
2.在build文件夹中,找到 webpack.dev.conf.js ,我们需要在这个js文件中配置Json
//第一步 const portfinder = require('portfinder'),在后面加上
const express = require('express');
const app = express(); //请求server
const appData = require('../src/mock/a.json'); //加载本地数据文件
const cityList = appData.city; //获取对应的本地数据
const apiRoutes = express.Router();
app.use('/api', apiRoutes); //通过路由请求数据
//第二步找到devServer,在里面添加
before(app){
app.get('/api/cityList',(req,res)=>{
res.json({
errno:0,
data:cityList
})
})
}
3.引入成功后,加载数据,重新启动项目,打开http://localhost:8080/api/cityList
4.在项目中展示Json 数据
const ERR_OK = 0;
export default {
name:'result',
data () {
return {
// cityList:[]
}
},
components: {
},
created(){
this.$http.get('/api/cityList').then((res) => {
if (res.data.errno === ERR_OK) {
console.log(res.data.data)
}
});
}
}
更多推荐
已为社区贡献5条内容
所有评论(0)