在React中，我们可以使用useEffect Hook来添加和移除事件侦听器。以下是一个示例代码，演示了如何在useEffect之外移除事件侦听器的问题以及如何解决它。

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

const App = () => {
  const buttonRef = useRef(null);

  useEffect(() => {
    const handleClick = () => {
      console.log('Button clicked');
    };

    buttonRef.current.addEventListener('click', handleClick);

    return () => {
      buttonRef.current.removeEventListener('click', handleClick);
    };
  }, []);

  return (
    

      Click me
    
  );
};

export default App;

在上面的代码中，我们使用了useRef Hook来创建一个引用变量buttonRef，并将其作为button元素的ref属性。然后，在useEffect中，我们添加了一个名为handleClick的事件处理函数，并使用addEventListener方法将其绑定到按钮的click事件上。最后，我们在useEffect的返回函数中使用removeEventListener方法来移除事件侦听器。

请注意，我们在useEffect的依赖数组中传递了一个空数组[]，以确保useEffect只会在组件挂载时运行一次，并且在组件卸载时移除事件侦听器。如果不传递依赖数组，useEffect将在每次组件渲染时运行，这将导致每次渲染时都创建一个新的事件侦听器，而没有移除旧的事件侦听器。

通过这种方式，我们可以确保在useEffect之外移除事件侦听器，并且可以正确地处理事件。