vue使用Mock模擬接口

1.安裝插件

npm install mockjs --save-dev

2.在main.js平級目錄下創建mock.js

const Mock=require('mockjs');
//獲取 mock.Random 對象
const Random = Mock.Random;
// mock一組數據
const allTitle=[
    "關於深化增值稅改革有關政策的公告",'關於深化增值稅改革有關事項的公告','關於調整增值稅納稅申報有關事項的公告','關於實施小微企業普惠性稅收減免政策的通知','這是測試數據','555555','99999'
]
const allKey=[
    "政策",'增值稅','稅納','稅收減免','這是測試數據','555555','測試'
]
const produceNewDate=function(){
    let articles=[];
    for(let i=0;i<7;i++){
        let newArticleObje={
            lawEffectId: 53,
            lawNo: "財政部 稅務總局 海關總署公告",
            oldDocId: null,
            provinceId: 732,
            publishDate: "2019-03-20",
            readid: 1912,
            reviseDate: null,
            taxId: "35",
            title: allTitle[i],
            topFlag: "1",
            topOrder: 1,
            userId: 2152,
            viewCount: 141,
        }
        articles.push(newArticleObject);
    }
    return{
        articles:articles
    }
}

const keysData=function(){
    let articles=[];
    for(let i=0;i<7;i++){
        articles.push(allKey[i]);
    }
    return{
        articles:articles
    }
}
// 需要幾個接口就定義幾個function,
//Mock.mock(url(接口地址),method(接口方式),上面定義的數據);
Mock.mock('/searchKey','post',keysData)
Mock.mock('/search','post',produceNewDate);

3.在main.js中引入

require('./mock.js');

4.在需要使用的組件中使用

axios.post('/search',params).then(
                res=>{
                    if(res.status == 200){
                        if(res.data.articles.length){
                            this.listData=res.data.articles;
                        }
                    }
                }
            ).catch(err=>this.$message.error(res.statusText));