zoukankan      html  css  js  c++  java
  • uniapp或者vue防暴力点击

    做防爆力点击,就是防抖或者节流,都是为了解决用户快速点击的时候连续操作两次或者连续跳转两次界面

    第一步,新建一个throttle.js

    // 处理多次点击
    function throttle(fn, params) {
        console.log(fn)
        let that = this;
        if (that.onoff && fn) {
            that.onoff = false;
            if (params) {
                fn(params);
            } else {
                fn()
            }
            setTimeout(function () {
                that.onoff = true;
            }, 1500)
        } else {
            console.log("请稍后点击")
        }
    }
    export {
    throttle}

    第二步,在需要防暴力点击界面的data中添加 onoff:true 初始化onshow或者mounted里也要初始化设置this.onoff = true,因为界面返回可能没有初始化data里的数据

    第三步,修改点击事件的写法

    <view class="address" @tap="$throttle(choose)"> <view class="userMsg"> <view class="def" v-if="addressMsg.isDefault">默认</view> <view class="name">{{addressMsg.contactName}}</view> <view class="tel">{{addressMsg.contactPhone}}</view> </view> <view class="addressMsg"> <view class="detailMsg">{{addressMsg.regionName}}{{addressMsg.streetName}}</view> <image class="mores" src="/static/image/trolley/more.png" /> </view> </view>

    就是讲点击事件嵌套一层,choose是方法名字,如果方法里需要传递参数的话,就这么写@tap="$throttle(方法名,参数)"

  • 相关阅读:
    Session攻击(会话劫持+固定)与防御
    console调试命令
    javascript获取当前url
    搞不清FastCgi与PHP-fpm之间是个什么样的关系
    MySQL基本语句优化10个原则
    PHP获取类名及所有函数名
    js闭包
    字段、方法、属性
    python面向对象之类成员修饰符
    实现Python代码发送邮件
  • 原文地址:https://www.cnblogs.com/ldlx-mars/p/13451654.html
Copyright © 2011-2022 走看看