vue中mockjs使用

安装mockjs

cnpm install mockjs --save-dev // cnpm是安装好nodejs之后最好再安装淘宝镜像cnpm

创建mock.js文件 // 文件名字自己自定义即可

// An highlighted block
 // 简单的返回示例
    //引入mockjs
    import Mock from 'mockjs'
    Mock.mock('api/datalist', {
        code:0,
        data: [
            {
                name: '张三',
                age: 15
            },
            {
                name: '李四',
                age: 18
            },
        ]
    });

这是一个传参获取数据的例子，参照此案例自己写逻辑

// An highlighted block
  import Mock from 'mockjs'
    Mock.mock(
        RegExp('api/datalist' + ".*"),
        'post',
        option=> {
            const { payload } = JSON.parse(option.body)
            console.log(option);
            if(payload === 666) {
                return {
                    code: 0,
                    data: [
                        {
                            name: '张三',
                            age: 15
                        },
                        {
                            name: '李四',
                            age: 18
                        },
                    ]
                }
            }else {
                return {
                    code: -1,
                    data: '参数错误'
                }
            }
        },
    )    

在main.js中引入mockjs

import ‘./mock’ // 这里就是引入你创建的mockjs文件路径

在想要使用接口的文件中直接使用！

// An highlighted block
   // axios安装使用这里不做讲解了，百度一下，我是直接使用的原生请求，没有去封装post get请求
    let payload = 666
    this.axios.post('api/datalist', {
        payload
    }).then(res=> {
        console.log(res.data)
        this.dataList(res.data.data)
    })