Vue中使用mockjs模拟数据

• 首先使用npm安装mockjs

npm i mockjs -S

• 安装好mockjs后在src目录下创建mock目录
• 在mock目录下准备JSON格式的数据
• 把mock数据需要的图片数据放在publicu目录下（将来打包时会把相应的资源原封不动的放到dist文件夹里）
• 开始mock。通过mockjs实现
• 在mock目录下创建mockServe.js通过mockjs实现模拟数据

// 先引入mockjs
import Mock from 'mockjs'

// webpack默认对外暴露的类型有图片和json格式数据 故json文件无需对外暴露

// 把json格式数据引入进来
import banner from './banner.json'
import floor from './floor.json'

// mock数据 第一个参数是请求地址 第二个参数是数据
Mock.mock('/mock/banner', {code: 200, data: banner})
Mock.mock('/mock/floor', {code: 200, data: floor})

• 把mockServe.js文件在入口文件（main.js）中引入
• 封装请求获取数据即可