1、新建 mock/mock.js

  1. 新建 mock/mock.js
  2. const Mock = require('mockjs');
  4. Mock.mock('/news/list', {
  5.     'items|20': [{
  6.         id: '@id',
  7.         name: '@name',
  8.         title: '@sentence(10, 20)',
  9.         'status|1': ['published', 'draft', 'deleted'],
  10.         author: '@cname', display_time: '@datetime',
  11.         pageviews: '@integer(300, 5000)'
  12.     }]
  13. })
  15. let addData = []
  16. Mock.mock('/mock/add', ops => {
  17.     addData.push(ops)
  18. })
  19. Mock.mock('/mock/getAdd', addData)
  20. // module.exports = [{
  21. //     url: '/news/list',
  22. //     type: 'get',
  23. //     response: config => {
  24. //         const items = data.items
  25. //         return {
  26. //             code: 20000,
  27. //             data: {
  28. //                 total: items.length,
  29. //                 items: items
  30. //             }
  31. //         }
  32. //     }
  33. // }]

2、main.js中引入

  2. require('./mock/index.js')

3、页面使用

  1. <div>
  2.       <input type="text" v-model="postData">
  3.       <button type="button" @click="submit">提交</button>
  4.       <button type="button" @click="getData">获取</button>
  5. </div>
  8. methods: {
  9.     submit () {
  10.       axios.post('/mock/add', { // 添加数据的接口,数据为一个对象，有个title属性
  11.         postData: this.postData
  12.       })
  13.     },
  14.     getData () {
  15.       axios.get('/mock/getAdd').then(res => { // 获取数据
  16.         console.log(res.data) 
  17.       })
  18.     }
  19.   },