react-easy-scrollbar/dist/esm/hooks/useEasyScrollbar.js

Completely pollution-free UI, perfect scrollbar implemented through CSS

import { useEffect, useRef } from 'react';
import PerfectScrollbar from 'perfect-scrollbar';
import 'perfect-scrollbar/css/perfect-scrollbar.css';
import "../scrollbar.css";
export var useEasyScrollbar = function useEasyScrollbar(ref, options) {
  var psRef = useRef(null);
  var _ps = psRef.current;
  useEffect(function () {
    if (!ref) {
      return;
    }
    if (typeof ref === 'function') {
      var fn = ref;
      ref = function ref(element) {
        fn(element);
        if (!element) {
          return;
        }
        if (element instanceof Element) {
          var computedStyle = window.getComputedStyle(element);
          var hasPositionStyle = computedStyle.position !== 'static';
          if (!hasPositionStyle) {
            // 添加 CSS 类
            element.classList.add('easy-container');
          }
          psRef.current = new PerfectScrollbar(element, options);
        } else {
          console.warn('ref current is not a HTMLElement');
        }
      };
    } else if (typeof ref === 'string') {
      var element = document.querySelector(ref);
      if (element) {
        if (element instanceof Element) {
          var computedStyle = window.getComputedStyle(element);
          var hasPositionStyle = computedStyle.position !== 'static';
          if (!hasPositionStyle) {
            // 添加 CSS 类
            element.classList.add('easy-container');
          }
          psRef.current = new PerfectScrollbar(ref, options);
        } else {
          console.warn('ref current is not a HTMLElement');
        }
      }
    } else {
      var _element = ref.current;
      if (_element) {
        if (_element instanceof Element) {
          var _computedStyle = window.getComputedStyle(_element);
          var _hasPositionStyle = _computedStyle.position !== 'static';
          if (!_hasPositionStyle) {
            // 添加 CSS 类
            _element.classList.add('easy-container');
          }
          psRef.current = new PerfectScrollbar(_element, options);
        } else {
          console.warn('ref current is not a HTMLElement');
        }
      }
    }
    return function () {
      if (_ps) {
        _ps.destroy();
      }
    };
  }, [_ps, ref, options]);
};
export default useEasyScrollbar;