首页 > 其他 > 详细

vue 中使用防抖和节流

时间:2020-03-13 17:48:03      阅读:180      评论:0      收藏:0      [点我收藏+]

1.在公共方法中(如 public.js 中),加入函数防抖和节流方法

// 防抖

export default {

  _debounce(fn, delay) {

    var delay = delay || 200;

    var timer;

    return function () {

        var th = this;

        var args = arguments;

        if (timer) {

            clearTimeout(timer);

        }

        timer = setTimeout(function () {

            timer = null;

            fn.apply(th, args);

        }, delay);

    };

  },

  // 节流

  _throttle(fn, interval) {

    var last;

    var timer;

    var interval = interval || 200;

    return function () {

        var th = this;

        var args = arguments;

        var now = +new Date();

        if (last && now - last < interval) {

            clearTimeout(timer);

            timer = setTimeout(function () {

                last = now;

                fn.apply(th, args);

            }, interval);

        } else {

            last = now;

            fn.apply(th, args);

        }

    }

  }

}

2.在需要使用的组件引用

import { public } from "@/utils/public";

3.在 methods 中使用

methods: {

    changefield: public._debounce(function(_type, index, item) {

        // do something ...    }, 200)

  }

 

vue 中使用防抖和节流

原文:https://www.cnblogs.com/edczjw-Edison/p/12487471.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!