如何模拟/监视ReactJS中ref上调用的addEventListener方法？

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

const MyComponent = () => {
  const ref = useRef(null);

  useEffect(() => {
    const originalAddEventListener = ref.current.addEventListener;

    ref.current.addEventListener = (eventName, handler, options) => {
      // 在这里可以进行模拟或监视操作
      console.log(`addEventListener called with eventName: ${eventName}`);

      // 调用原始的addEventListener方法
      originalAddEventListener.call(ref.current, eventName, handler, options);
    };

    return () => {
      // 清理操作
      ref.current.addEventListener = originalAddEventListener;
    };
  }, []);

  return <div ref={ref}>Hello World</div>;
};

export default MyComponent;