mockjs使用入门

4,035 阅读1分钟

备注:可根据自己的项目环境进行实际操作,本人实在vue-cli4.0脚手架下安装

一、安装mockjs

在项目目录下安装依赖

npm install mockjs --save-dev
or
yarn add mockjs

二、引入mockjs

新建api.js文件,引入安装好的依赖

import Mock from 'mockjs'

// 模拟数据,具体使用查看文档
// 这里的/api是项目里的baseurl,你项目中的baseUrl是什么这里就改成什么
Mock.mock('/api/user/login', {
  status: 0,
  'data|10': [{
    'id|10000-11000': 0,
    username: '@cname',
    email: '@email',
    phone: /^1[385][1-9]\d{8}/,
    role: 0,
    createTime: 1479048325000,
    updateTime: 1479048365000
  }]
})

三、引入api.js

main.js文件中引入api.js文件

// mock开关,设置是否引入文件
const mock = true
if (mock) {
  require('./mock/api') // 注意使用require,不用import,在需要的时使用。
}

四、页面调用接口

这个项目里我使用了axiosvue-axios

this.axios.get('/user/login').then(res => {
    console.log(res.data)
})

关于文章中有疑问的可以给我评论,我再作回复。