mock.js demo

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<script src="./mock.js"></script>
<body>
    <div class="btn">点我</div>
</body>
</html>
{
 "name": "demo",
 "version": "1.0.0",
 "description": "",
 "main": "mock.js",
 "scripts": {
 "test": "echo \"Error: no test specified\" && exit 1"
 },
 "keywords": [],
 "author": "",
 "license": "ISC",
 "dependencies": {
 "axios": "^0.18.0",
 "mockjs": "^1.0.1-beta3"
 }
 }
import mock, { Random } from 'mockjs'
import axios from 'axios'

let str=Random.string()
let data=mock.mock({
    "name":Random.cname(),
    "age|1-30":13,
    "address":Random.county(),
    "token":Random.guid(),
    "personId":Random.id(),
    "email":Random.email(),
    "ip":Random.ip(),
    "des":Random.csentence( 5, 30 ),
    "content":Random.cparagraph(50,200),
    "password":Random.word(6,15),
    "avator":Random.dataImage('100x100','icon'),
    "createAt":Random.datetime(),
    "updateAt":Random.now(),
    "sex|1":0
})

mock.mock(/\/user*/,'get',function(params){
    console.log('收到3',params)
    /**
     * 收到3 body 数据
        {url: "/user?ID=12345", type: "GET", body: null}
     */
    return data
})

window.οnlοad=function(){
    let btn=document.querySelector('.btn')
    
    btn.οnclick=function(){
       
    }
    axios.get('/user',{
        params: {
            ID: 12345
        },
        // `headers` 是即将被发送的自定义请求头
        headers: {'X-Requested-With': 'XMLHttpRequest'},
    })
    .then(res=>{
        // {data: {数据对象}, status: 200, statusText: "OK", headers: {…}, config: {请求体}, request (xml请求实例)}
        console.log('成功',res.data)
    })
    .catch(err=>{
        console.log('失败',err)
    })
}

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值