vue项目mock数据

在vue项目中 mock.js 的使用#

• 官网github：https://github.com/nuysoft/Mock/wiki/Getting-Started

1. 安装:
   npm install mockjs --save-dev

2. 在main.js 同目录创建 mock.js

3. 在main.js 中引入
   require("./mock")

---

//mock.js

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

//当post或get请求到/api/data 路由时Mock会拦截请求并返回下面的数据
Mock.mock("/api/data",(req,res)=>{
    console.log(req,res);
    let list = [];
    for(let i = 0;i<20;i++){
        let listObj = {
            tite:Random.ctitle(4,10),
            company: Random.csentence(5, 10),
            attention_degree: Random.integer(100, 9999),//返回一个随机的整数。
            photo: Random.image('114x83', '#00405d', '#FFF', 'Mock.js')
        }
        list.push(listObj);
    }
    return {
        data: list
    }
})

// 使用 //home.vue

methods: {
    getList(){
      axios({
        method:'post',
        url: "/api/data",
      }).then(res=>{
        this.list = res.data.data;
        console.log("结果",res.data.data);
      })
    }
  }