在vue项目中使用mockjs模拟接口数据

进入mock官网

在mock的官网上方有很多语法示例，可以看一看。官网里面有详细的文档说明，点击开始
先安装mockjs
npm install mockjs
在你的项目src文件下新建mock文件，在mock文件里新建mock.js文件

mock.js`

const Mock = require('mockjs');
const Random = Mock.Random;

写的接口可以全部放在这一个文件中，具体怎么写，mock有自己的语法规范，看官网。
在需要调用模拟接口的vue组件中，引入mock.js

然后就可以像正常获取接口那样来获取数据了
小例子源码
mock.js

const Mock = require('mockjs');
const Random = Mock.Random;

Mock.mock('/list',{
    
    
  'age|10-20':10
})

test.vue

<template>
  <div>
    <div>我什么都不知道</div>
    <span>{
    
    {
    
    age}}</span>
  </div>
</template>

<script>
import '../mock/mock.js'
export default {
    
    
  name: 'test',
  data: function () {
    
    
    return {
    
    
      hospitalList: [],
      age: 16
    }
  },
  methods: {
    
    
    getHospitals () {
    
    
      this.axios.post('/list').then(response=>{
    
    
      // this.$http.post('/list').then(response=>{
    
    
        console.log(response.data)
        this.age = response.data.age
      }).catch( err => {
    
    
        console.log('获取错误')
      })
    }
  },
  }
</script>

<style scoped>

</style>