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)
          }
        });
    }
  }

Logo

前往低代码交流专区

更多推荐