在Vue项目中使用mock假数据模拟后端接口

安装

npm install --save-dev mockjs

引入

为了让mock中的数据只在开发环境中有效，防止其与生产环境的数据出现混淆，可以：

在config/dev.env.js文件中加入 MOCK: ‘true’

module.exports = merge(prodEnv, {   NODE_ENV: '"development"',   MOCK: 'true', }) 

在config/prod.env.js文件中加入 MOCK: ‘false’

module.exports = {   NODE_ENV: '"production"',   MOCK: 'false', } 

在main,js中添加

process.env.MOCK && require('@/mock') 

注意

此时想要项目运行不出错，需要先在src下新建一个mock目录，在mock目录下新建一个index.js文件

mock数据

import Mock from 'mockjs' Mock.mock('/local-server/login', function () {   return {     data: {       RETCODE: 'AAAAAAA',       RETMSG: '登录成功'     }   } }) 

发起请求

let data = [] this.$axios     .post('/local-server/login', data)     .then(res => {     //...     }