anti-shake-and-per

防抖与权限控制

Usage no npm install needed!

<script type="module">
  import antiShakeAndPer from 'https://cdn.skypack.dev/anti-shake-and-per';
</script>

README

anti-shake-and-per

防抖与权限控制

创建日期:2020-10-23

防抖使用方法

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>dome1</title>
    <script src="anti-shake-and-per.js"></script>
</head>
<body>

<button onclick="clickc()">按钮</button>

<script>

    var {AntiShakeAndPer, AntiShakeAndPerConfig} = AntiShakeAndPer

    var antiShakeAndPer = new AntiShakeAndPer(new AntiShakeAndPerConfig(
        function () { /** 设置事件开始事件 */
            console.log('请求中')
        },
        function () { /** 设置事件结束事件 */
            console.log('结束')
        },
        function (type) { /** 设置事件异常事件,传入事件类型,1:上一个事件还未结束,2:没有权限 */
            console.log(type)
            if (type === 1) {
                console.log('请勿重复请求')
            }
            if (type === 2) {
                console.log('没有权限')
            }
        },
        10000 /** 设置10秒后不执行结束操作将自动结束,次此控制台会出现警告 */
    ))

    var clickc = function () {
        antiShakeAndPer.run(function (done) {
            console.log('a')
            setTimeout(() => { /** 模拟异步请求,得到响应后调用结束操作 */
                done()
            }, 3000)
        })
    }
</script>
</body>
</html>

权限控制使用方法

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>dome2</title>
    <script src="anti-shake-and-per.js"></script>
</head>
<body>

<button onclick="setUserData()">设置用户信息</button>
<button onclick="openSystem()">启动</button>
<button onclick="closeSystem()">关闭</button>

<script>

    var {AntiShakeAndPer, AntiShakeAndPerConfig} = AntiShakeAndPer

    var antiShakeAndPer = new AntiShakeAndPer(new AntiShakeAndPerConfig(
        function () {
            console.log('请求中')
        },
        function () {
            console.log('结束')
        },
        function (type) {
            if (type === 1) {
                console.log('请勿重复请求')
            }
            if (type === 2) {
                console.log('没有权限')
            }
        },
        10000
    ), ['OPEN_SYSTEM', 'CLOSE_SYSYTEM']) /** 创建对象时,将当前用户的角色权限传入 */

    var setUserData = function () {
        antiShakeAndPer.run(function (done) {
            console.log('SET_USER_DATA')
            setTimeout(function () {
                done()
            }, 3000)
        }, 'SET_USER_DATA') 
        /** 执行操作时传入该事件的权限标识符,当这个权限标识符存在与这个用户的角色权限列表时才会执行这个事件,否在执行错误事件并传入参数2 */
    }

    var openSystem = function () {
        antiShakeAndPer.run(function (done) {
            console.log('OPEN_SYSTEM')
            setTimeout(function () {
                done()
            }, 3000)
        }, 'OPEN_SYSTEM')
    }

    var closeSystem = function () {
        antiShakeAndPer.run(function (done) {
            console.log('CLOSE_SYSYTEM')
            setTimeout(function () {
                done()
            }, 3000)
        }, ['SET_USER_DATA', 'DELETE_USER_DATA']) /** 当一个事件存在多个权限时,可传入多个权限标识符,其中一个符合就会执行事件 */
    }
</script>
</body>
</html>

<<<<<<< HEAD 完

2020-10-28:修复执行事件时,不传权限标识符报没权限问题 2020-10-28:新增没有调用结束事件时,响应错误事件,传入参数3

2020-12-28:兼容ie11