项目中使用Mockjs模拟数据

1.首先需要安装mockjs

npm install mockjs --save-dev

2. 如下图目录结构创建了一个version.js,用于写自动生成json数据的方法

项目中使用Mockjs模拟数据

version.js代码:

 1 import Mock from 'mockjs'; 
 2 
 3 const listVersion = () => {
 4   let data = {
 5     respCode: 100,
 6     rows: [],
 7     total: 10
 8   };
 9 
10   for (let index = 0; index < 10; index++) {
11     data.rows.push(Mock.mock({
12       versionId: '@natural',
13       versionName: '@ctitle',
14       versionNum:'@ctitle',
15       sotaAppName: '@ctitle',
16       versionStatus:'2',
17       updateTime: '@datetime'
18     }))
19   }
20   return data;
21 }
22 
23 export default {
24   listVersion
25 }

在第一张图中index.js中写代码:

1 import Mock from 'mockjs' 
2 import listVersion from "./data/version";
3
4 Mock.mock('news/api','post',listVersion);

在工程入口main.js中添加引用

import './mock'  //这样写是会默认到mock文件夹下找index文件,执行了index.js中的Mock.mock()下面才回有数据返回

此时就可以在代码中用mock虚拟数据了:

1  this.axios.post('news/api')
2           .then((res) => {
3               console.log(res)
4           })
5           .catch((err) => {
6             console.log(err)
7           })

打印出的内容:

项目中使用Mockjs模拟数据

 

上一篇:vue 利用mockJs 模拟数据


下一篇:mockjs处理前端传来的路径,获取?后面的值