使用mock造前端假数据

其实在实际开发的过程中我们是使用后端写好的接口的，但是在一些没有数据的情况下我们可以自己造！！！

1. 安装mockjs：在终端中运行以下命令来安装mockjs库：

npm install mockjs --save-dev

1. 创建mock数据文件：在项目的根目录下创建一个名为mock的文件夹，然后在该文件夹下创建一个名为data.js的文件。

2. 编写mock数据：在data.js文件中，可以使用mockjs提供的语法来编写模拟数据。例如，可以使用mockjs的Mock.mock()方法来模拟一个API接口返回的数据，示例如下

import Mock from 'mockjs';

Mock.mock('/api/data', 'get', {
  'list|5': [{
    'id|+1': 1,
    'name': '@cname',
    'age|18-60': 1,
    'gender|1': ['男', '女']
  }]
});

上述代码模拟了一个名为/api/data的GET请求，返回一个包含5个对象的数组，每个对象包含id、name、age和gender属性，其中id自增，name是随机的中文名字，age是18到60之间的随机数，gender是男或女。

1. 引入mock数据：在Vue项目的入口文件（一般是main.js）中引入mock数据，示例如下：

import './mock/data.js';

1. 启动项目：运行Vue项目，mock数据将会被拦截并返回给前端。

需要注意的是，使用mockjs只能模拟前端的请求，对于后端接口的请求无法拦截并返回模拟数据。如果需要模拟后端接口的数据，可以使用其他工具，如Postman、Swagger等。