我写了这个小小的React钩子：

type Callback = () => void

function useElementEffect<T extends Element>(callback: (el: T) => (Callback | void)) {
    let cb: Callback | void
    return useCallback((el: T) => {
        if(el) {
            cb = callback(el)  // <-- eslint error here
        } else if(cb) {
            cb()
        }
    }, [])
}

您可以像这样使用它：

function CenterCanvas() {
    const [[width, height], setSize] = useState([300, 150])
    const ref = useElementEffect((div: HTMLDivElement) => {
        const obs = new ResizeObserver(entries => {
            for(const entry of entries) {
                const contentBoxSize = entry.contentBoxSize[0]
                setSize([
                    Math.floor(contentBoxSize.inlineSize),
                    Math.floor(contentBoxSize.blockSize)
                ])
            }
        })
        obs.observe(div)
        return () => obs.disconnect()
    })

    return (
        <$Center ref={ref}>
            <TheCanvas width={width} height={height}/>
        </$Center>
    )
}

它运行得很好，但在cb = callback(el)行上出现ESLint错误：
ESLint：从React Hook useCallback内部对"cb"变量的赋值将在每次呈现后丢失。若要长期保留该值，请将其存储在useRef Hook中，并将可变值保留在."current"属性中。否则，可以直接将此变量移动到useCallback内部。（react-hooks/exhautive-deps）
然而，当CenterCanvas被卸载时，cb()的调用似乎非常好，没有错误，所以cb似乎有足够长的时间被调用，即使它在下一次渲染时再次被覆盖（我希望如此）。
我应该忽略这个警告，还是有一些情况下，这不会工作？