Socket
Socket
Sign inDemoInstall

freeze-click

Package Overview
Dependencies
Maintainers
2
Versions
14
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

freeze-click

防止多次点击


Version published
Maintainers
2
Created
Source

freeze-click


author: bugszhou | Email:bugszhou@outlook.com
description: 防止多次点击

freeze-click(冻结点击):在用户点击一个按钮时,为了节流保证用户在接口返回后,再次点击才触发下一次请求

Usual

  • 默认冻结10s,10s内只请求一次,需要手动调用cancel取消冻结才能发送第二次请求。未调用cancel将在60s后自动释放。
  1. install
npm install --save freeze-click;
  1. Use
import freezeClick from 'freeze-click';

const handleClick = freezeClick((t) => {
    //t 为freeze-click实例
    setTimeout(() => {
        console.log('click');
    }, 5000);
});

// just call one time
handleClick();
handleClick();
handleClick();

setTimeout(() => {
    handleClick(); // call again
}, 6000);

freezeClick(func, [freezeTime=60*1000])

const freezeFn = freezeClick(func, 10000);

创建并返回一个冻结函数,在 freezeTime(默认60*1000ms,单位ms) 秒内最多执行 func 一次的函数。 在执行func(freezeFnObj)函数时,会把冻结函数的实例(freezeFnObj)作为第一个参数,freezeFnObj含有 cancel 方法用于取消延迟的函数。

  • 例如:
const handleClick = freezeClick((freezeFnObj) => {
    //t 为freeze-click实例
    setTimeout(() => {
        console.log('click');
        freezeFnObj.cancel()
    }, 5000);
});

handleClick();
setTimeout(() => {
    handleClick(); // call again
}, 5100);
  • 参数

func(Function): 需要冻结的函数,第一个参数为freezeFnObj含有 cancel 方法用于取消延迟的函数。 freezeTime(number): 需要冻结的时间,单位ms

  • 返回

(Function): 冻结后的函数

setWaitTime(wait = 10 * 1000)

修改冻结时间

import {setWaitTime} from 'freeze-click';

setWaitTime(500);

Keywords

FAQs

Package last updated on 01 Jul 2022

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc