mock.js 基本使用

下载 mock.js

npm i mockjs

在 src 文件下面创建 mock 文件夹

在mock 文件夹中 创建 index.js 文件

在index.js 文件中 做一下操作

/* 引入 mock */
import  Mock  from "mockjs";
/* 引入模拟数据 */
import panel from './panel.json'

/* 模拟请求数据接口 */
Mock.mock('/mock/panel',{code:0,panel})

panel.json 文件实例

{
    "panel":[
        {
            "title":"总订单",
            "icon":"icon-dingdan1",
            "count":9000,
            "color":"#0092D7"
        },
        {
            "title":"总销售额",
            "icon":"icon-dangrixiaoshoue",
            "count":9000,
            "color":"#EA0063"
        },
        {
            "title":"今日订单",
            "icon":"icon-dingdan",
            "count":9000,
            "color":"#0093D8"
        },
        {
            "title":"今日销售额",
            "icon":"icon-a-icon-xiaoshoue-fuben",
            "count":9000,
            "color":"#00FE48"
        }
    ]
}

在 utils 文件下 需要重新配置一个 mocl 的 axios 文件，实例如下

import axios from 'axios'

const service = axios.create({
    baseURL: '/mock',
    timeout: 30000,
});

service.interceptors.request.use((config)=>{
    return config;
}, (error) =>{
    nprogress.done();
    return Promise.reject(error);
});

service.interceptors.response.use((response)=>{
    return response;
},(error)=>{
    return Promise.reject(error);
});

export default service      

  最后在 main,js 中 引入mock 文件

import '@/mock/index.js'