mockJs模拟数据在vue中的的用法

第一步

    安装mockjs：npm install mockjs --sava-dev

第二步

    在项目src中创建一mockJs文件夹，在改文件夹下面创建一个mock.js文件，并且在main.js中引入这个文件。如图：

                

第三步 

    mockjs的使用，在mock.js中模拟简单的一些数据，代码如下：

     const Mock = require('mockjs')
     const Random = Mock.Random
     const produceData = function (opt) {
console.log(opt, 'opt')
let articles = [];
for (let i = 0; i < 30; i++) {
let newAriticleObject = {
title: Random.csentence(5, 30),
thumbnail_pic_s: Random.dataImage('300x250', 'mock的图片'),
author_name: Random.cname(),
date: Random.date() + ' ' + Random.time()
}
articles.push(newAriticleObject)
    }
    return {
data: articles
    }
        }

    Mock.mock('/news', /post|get/i, produceData)

第四步  使用

   先安装axios

    npm install axios --sava

    然后在main.js中引入 import axios from 'axios'

    注意：axios不能使用Vue.use（），而是这样Vue.prototype.axios = axios

    然后在created中调用，打印出来看看数据

    this.axios.get('/news', "")
.then(res => {
console.log(res.data.data)

})

    动一遍手基本上就差不多明白

关于生成什么数据的参考地址：http://mockjs.com/examples.html#Name