前端Mock

Mock快速使用

• 安装Mock
  npm install mockjs --save-dev

• 在项目中创建mock.js，并写一个简单的返回示例，后面拦截其他url的ajax请求直接参考这个示例。

//引入mockjs
import Mock from 'mockjs'
//使用mockjs模拟数据
Mock.mock('/\/api\/msdk\/proxy\/query_common_credit/', {
    "ret":0,
    "data":
      {
        "mtime": "@datetime",//随机生成日期时间
        "score|1-800": 800,//随机生成1-800的数字
        "rank|1-100":  100,//随机生成1-100的数字
        "stars|1-5": 5,//随机生成1-5的数字
        "nickname": "@cname",//随机生成中文名字
      }
//data里的属性看不懂，需要详细看语法规范,链接：https://github.com/nuysoft/Mock/wiki/Syntax-Specification
});
//延时200-600毫秒请求到数据
Mock.setup({
    timeout: '200-600'
})

• main.js里面引入该文档

import ‘./assets/js/mock’//此部分引入的是我们所编写的mockjs文档

• 在vue页面中使用
  这时返回的response就是mock.js中用Mock.mock(‘url’,data）中设置的data了。

     getData(){
      var url = '/api/msdk/proxy/query_common_credit';
      this.$axios.get(url)
        .then(response => {
          
        })
        .catch(error => {
          
        })
    }