mock的使用demo+常用模板

2021-08-05  本文已影响0人  浅浅_2d5a

控制台可以直接使用Mock
Mock.mock({
"string|1-10": "★"
})

mock的demo

安装

npm i mockjs -S

vue项目中 demo

main.js中引入创建的mock.js
import './mock/mock';

常用api语法

Mock.mock(url, type, data)

注意:
1、接口地址不为正则
2、不用再次导出Mock
3、nextwork中不会出现接口调用,需要console.log打印调试
mock.js代码

import Mock from 'mockjs'

Mock.mock('/api/msdk/proxy/query_common_credit', {
    'status': 200,
    "data":
      {
        "mtime": "@datetime",//随机生成日期时间
        "score|1-800": 800,//随机生成1-800的数字
        "rank|1-100":  100,//随机生成1-100的数字
        "stars|1-5": 5,//随机生成1-5的数字
        "nickname": "@cname",//随机生成中文名字
      }
});
Mock.mock('/api/userinfo','get', {
    "data":
      {
        age:12
      }
});
//设置数据延时
Mock.setup({
    timeout: '200-600'
})

调用接口的接口请求js

import fetch from '../../api/fetch'
export default{
    //获取用户基本信息接口 get请求
    getUserInfo(){
        return fetch({
            url: '/api/msdk/proxy/query_common_credit',
        })
    },
}

mock的模板

官网查询 http://mockjs.com/examples.html

mock+nodejs

目的:实现随机接口数据+nextwork走接口
nodejs正常写
提供接口的地方加上mock

let express = require('express');   //引入express
let Mock = require('mockjs');       //引入mock

var app = express();
app.get('/aaa', function(req, res) {
    let resData = Mock.mock({
        'status': 200,
        'dataSource|1-9':[{
            'key|+1': 1,
            'mockTitle|1':['肆无忌惮'],
            'mockContent|1': ['角色精湛主题略荒诞', '理由太短 是让人不安', '疑信参半 却无比期盼', '你的惯犯 圆满', '别让纠缠 显得 孤单'],
            'mockAction|1': ['下载', '试听', '喜欢']
        }]
    })
    res.send(resData);
})
var server = app.listen(8081, function() {
    var host = server.address().address
    var port = server.address().port
    console.log("Node.JS 服务器已启动,访问地址: http://%s:%s", host, port)
})
上一篇下一篇

猜你喜欢

热点阅读