How to use the throttle-debounce/throttle function in throttle-debounce

mounted() {
    this.init();
    this.throttledScrollHandler = throttle(300, this.onScroll);
    this.container.addEventListener('scroll', this.throttledScrollHandler);
  },

created() {
    this.throttledArrowClick = throttle(300, true, index => {
      this.setActiveItem(index);
    });
    this.throttledIndicatorHover = throttle(300, index => {
      this.handleIndicatorHover(index);
    });
  },

if (this.$isServer) return;

        const { scrollContainer } = this;
        let _scrollContainer = null;

        if (isHtmlElement(scrollContainer)) {
          _scrollContainer = scrollContainer;
        } else if (isString(scrollContainer)) {
          _scrollContainer = document.querySelector(scrollContainer);
        } else {
          _scrollContainer = getScrollContainer(this.$el);
        }

        if (_scrollContainer) {
          this._scrollContainer = _scrollContainer;
          this._lazyLoadHandler = throttle(200, this.handleLazyLoad);
          on(_scrollContainer, 'scroll', this._lazyLoadHandler);
          this.handleLazyLoad();
        }
      },
      removeLazyLoadListener() {

let childNodes = treeNodes[self.treeProps.children];

                for(let i=0;i{
                    child.visible = child[self.treeProps.label].toLowerCase().indexOf(self.query.toLowerCase())>-1;
                    self.treeFilterMethod(child);
                })
                if (!node.visible && childNodes.length) {
                    let allHidden = true;

containerWidth,
      velocityX
    } = props;

    const [leftEdge, rightEdge] = calculateEdgeTranslateXDistances({ thumbnails, containerWidth });

    this.state = {
      leftEdge,
      rightEdge,
      scrollerTranslateX: leftEdge
    };

    this.lastTranslateX = leftEdge;
    this.VELOCITY_X = velocityX || 1;

    this.throttledHandleWheel = throttle(100, this.throttledHandleWheel);
  }

mounted() {
    this.componentScrollBar = this.$refs.componentScrollBar
    this.componentScrollBox = this.componentScrollBar.$el.querySelector('.el-scrollbar__wrap')
    this.throttledScrollHandler = throttle(300, this.handleScroll)
    this.componentScrollBox.addEventListener('scroll', this.throttledScrollHandler)
    this.renderAnchorHref()
    this.goAnchor()
    document.body.classList.add('is-component')
  },
  destroyed() {

addEventListeners() {
    this.boundHandleScroll = this.handleScroll.bind(this)
    this.throttledHandleStepChange = throttle(50, true, this.handleStepChange, true)
    document.addEventListener('wheel', this.boundHandleScroll)
  }

this.timerId = setTimeout(() => {
      this.setState({ hasRendered: true });
    }, 100);

    window.addEventListener('resize', this.handleResize, false);
    requestAnimationFrame(this.tick);
  }

  componentWillUnmount() {
    window.removeEventListener('resize', this.handleResize, false);
    if (this.timerId) {
      clearTimeout(this.timerId);
    }
  }

  handleResize = throttle(100, () => {
    if (this.resizeHandler) {
      this.resizeHandler();
    }
    this.setupGrid();
    this.setupField();
    this.setState({
      windowSizeKey: getWindowSizeKey(),
    });
    if (this.ctx) {
      this.renderField(this.ctx);
    }
  });

  setupGrid = () => {
    const canvas = this.canvas;