如何访问useEffect以外的dom变量

Question

我的画布功能组件太大。我想拆分Class Star，useEffect（初始化，设置动画）并调整事件大小。

const Canvas = () => {
   useEffect(() => {
      const canvas = canvasRef.current;
      const context = canvas.getContext('2d');

      class Star {
        ...
      }

      const init = () => {...}; // using canvas
      const animate = () => {...}; // contex
      window.addEventListener('resize', onResize) // onResize using init function
      ...

   }, [])
}

但是我对context有疑问，因为Class Star和animate使用了它。 init使用canvas。 onResize也使用init函数。 我试图对resize事件进行挂钩，但是init函数有问题，或者我们无法嵌套useEffects。