vue中使用mockjs

第一步安装mockjs:npm i mockjs -S
在src目录下新建mock文件夹,文件夹添加test.js
test.js内容如下:

import Mock from 'mockjs';
const List = [];
const count = 20;


for (let i = 0; i < count; i++) {
  List.push(Mock.mock({
    id: '@id',
    title: '@ctitle(10, 20)',
    'status|1': ['published', 'draft'],
    author: '@cname',
    display_time: '@datetime',
    pageviews: '@integer(300, 5000)'
  }));
}


const nowPeople = {
  "errcode": "0",
  "errmsg": "success",
  "data": {
    "expo_audience": "@integer(100, 5000)",
  }
}

const viewNumber = {
  "errcode": "0",
  "errmsg": "success",
  "data": { "desk_num": 24, "desk_duration": 105.50, "per_desk_duration": 25.20 }
}

export const nowPeopleData = Mock.mock('http://compony.com/api/v1/t1', nowPeople);
export const viewNumberData = Mock.mock('http://compony.com/api/v1/t2', viewNumber);

在main.js中引入:
import * as expo from './mock/test.js'
axios.defaults.baseURL = 'http://compony.com/api/v1'
在组件中使用:

this.axios.get('/t1').then((data) => {
}

等到后台开发好api后,只需要注释掉import * as expo from './mock/test.js' 即可,其他代码都不用动

posted @ 2017-09-14 17:54  wmui  阅读(906)  评论(0编辑  收藏  举报