import React, { useCallback, useEffect } from 'react';

export default function WheelScale({ dom, setScale }) {
  const onWheel = useCallback(
    e => {
      if (e.ctrlKey || e.metaKey) {
        e.preventDefault();
        e.stopPropagation();
        setScale(e.deltaY > 0 ? -0.2 : 0.2);
      }
    },
    [setScale]
  );

  //滚轮缩放
  useEffect(() => {
    if (dom) {
      dom.addEventListener('mousewheel', onWheel, { passive: false });
    }
    return () => {
      if (dom) {
        dom.removeEventListener('mousewheel', onWheel, { passive: false });
      }
    };
  }, [dom, onWheel]);
  return <></>;
}
