应用背景:若前端开发完成,后台还没有提供数据接口时,前端部分可以先模拟数据进行测试。
Mock介绍:我们可以使用mock模拟数据,拦截ajax请求,模拟后台返回的数据,完成前端的测试。
一个简单的例子:
1、在src文件夹下创建mock文件夹
2、在mock中创建index.js,使用Mock.mock拦截请求
import Mock from 'mockjs'
import marketAPI from './market'
// Mock.mock(url,urltype,返回数据)
Mock.mock(/\/tenantStatistic\/getStatisticList/, 'post', marketAPI.getStatisticList)
3、创建market.js,定义getStaisticList方法,返回模拟数据
// 这是我模拟的后台应提供的数据
const json = {
'code': 0,
'data': [
{
'tenant_id': 99,
'tenant_refs': 100,
'tenant_name': '山东',
'tenant_orders': 100,
'tenant_shares': 100,
'tenant_views': 100
},
{
'tenant_id': 80,
'tenant_refs': 100,
'tenant_name': '山东',
'tenant_orders': 100,
'tenant_shares': 90,
'tenant_views': 100
}
]
}
export default {
getStatisticList: config => {
return json
}
}
4、最后别忘了在main.js中,引用mock
import './mock' // simulation data
这样就okk了