mockjs的使用
作用: 根据数据模板生成模拟数据。
1、 安装mockjs cnpm i mockjs
2、 src文件下,新建文件夹mockjs,
3、 mockjs文件中新建 index.js 和 home.js文件
4、home.js文件夹写入需要模拟数据
import Mock from 'mockjs' export default { getHomeData: () => { return { code: 200, data: { videoData: [ { name: 'C语言',
//Mock.Random.float(整数部分的最小值, 整数部分的最大值, 小数部分位数的最小值, 小数部分位数的最大值) value: Mock.Random.float(1000, 10000, 0, 2) }, { name: 'Vue', value: Mock.Random.float(1000, 10000, 0, 2) }, { name: '小程序', value: Mock.Random.float(1000, 10000, 0, 2) }, { name: 'React', value: Mock.Random.float(1000, 10000, 0, 2) }, { name: 'ES6', value: Mock.Random.float(1000, 10000, 0, 2) }, { name: 'C++', value: Mock.Random.float(1000, 10000, 0, 2) }, ] } } } }
5、 index.js文件写入:
import Mock from 'mockjs' import homeAPi from './home' // 设置200-2000毫秒延时请求数据 Mock.setup({ timeout: '200-2000' })// 拦截 /home/getData的Ajax请求 Mock.mock(//home/getData/, 'get', homeAPi.getHomeData)
6、 在main.js引入mockjs文件夹
import http from './api/config'
成功得到的数据