mockjs模拟数据的基本使用

Mock.js 生成随机数据，拦截 Ajax 请求

基本使用步骤

1.终端安装插件

# 安装
npm install mockjs

2.在项目目录中新建mock.js文件

• 引入mockjs
• 根据请求路径匹配，拦截对应ajax的请求，返回自定义的模拟数据

var Mock = require('mockjs')

Mock.mock(/\/v1_1\/articles/, function (options) {
  return {
    message: 'OK',
    data: {
      page: 1080,
      pre_timestamp: 1603536060815,
      results: [
        {
          title: 'Scrapy和Django实现蚌埠医学院手机新闻网站制作',
          aut_id: 2,
          pubdate: '2018-11-29T15:57:21',
          ch_id: 14,
          cover: {
            type: 0,
            images: []
          },
          is_top: 0,
          art_id: 65569,
          aut_name: '翔爷',
          comm_count: 0,
          like_count: 0,
          collect_count: 0
        },
        {
          title: 'Scrapy和Django实现蚌埠医学院手机新闻网站制作',
          aut_id: 2,
          pubdate: '2018-11-29T15:57:21',
          ch_id: 14,
          cover: {
            type: 1,
            images: ['https://img.yzcdn.cn/vant/cat.jpeg']
          },
          is_top: 0,
          art_id: 65569,
          aut_name: '翔爷',
          comm_count: 0,
          like_count: 0,
          collect_count: 0
        },
        {
          title: 'Scrapy和Django实现蚌埠医学院手机新闻网站制作',
          aut_id: 2,
          pubdate: '2018-11-29T15:57:21',
          ch_id: 14,
          cover: {
            type: 3,
            images: ['https://img.yzcdn.cn/vant/cat.jpeg', 'https://img.yzcdn.cn/vant/cat.jpeg', 'https://img.yzcdn.cn/vant/cat.jpeg']
          },
          is_top: 0,
          art_id: 65569,
          aut_name: '翔爷',
          comm_count: 0,
          like_count: 0,
          collect_count: 0
        }
      ]
    }
  }
})

3.在main.js中引入mock.js

• 判断处于开发环境下，才引入使用

// 当处于开发环境时，引入mock进行ajax请求拦截，返回模拟的数据
if (process.env.NODE_ENV === 'development') {
  require('@/utils/mock')
}