iview admin 使用mock.js模拟数据

最近在使用ivew admin做项目，为了前后端分离使用mock模拟数据，记录步骤：

1.文件结构：

2.打开src / mock，新建文件glbr.js：

3.编写需要模拟的数据结构：

import Mock from 'mockjs'
import {
  doCustomTimes
} from '@/libs/util';
export const getHospital = (req) => {
  let hosList = [];
  doCustomTimes(5, () => {
    hosList.push(Mock.mock({
      id: "@id",
      value: "@name"
    }))
  })
  return hosList;
}

1. 引入Mock
2. 引入iview admin编写好的api，用来重复执行数据模拟的过程
3. 编写一个Mock模拟函数
4. 定义一个空数组用来存放数据
5. doCustomTime(times,callback)的作用是重复执行times次callback，相当于一个while循环
6. 使用Mock.mock()函数模拟数据并push进数组
7. 返回模拟完数据的数组

4.将这个API写入index.js用来拦截请求返回数据

Mock.mock(/\/get_hos/,getHospital)

5.将它扔到公用请求数据api文件(src/api/data.js)中，进行模拟请求(axios)

export const getHospital =()=>{
  return axios.request({
    url:'get_hos',
    method:"get"
  })
}

6.在需要的页面引入这个方法并调用

import {getHospital} from '@/api/data';
export default {
  methods: {
    info(){
     getHospital().then(res=>{
          console.log(res)    
      });
    }
  },
}

res即为请求Mock后返回的模拟数据：

{data: Array(5), status: 200}
data: Array(5)
0:
id: "450000201605254957"
value: "Larry Harris"
__proto__: Object
1:
id: "500000197701282523"
value: "Larry Johnson"
__proto__: Object
2:
id: "45000020150226444X"
value: "Nancy Harris"
__proto__: Object
3:
id: "220000201612141886"
value: "Larry Perez"
__proto__: Object
4:
id: "430000201712193834"
value: "Donald Thompson"
__proto__: Object
length: 5
__proto__: Array(0)
status: 200
__proto__: Object

完...