当我选择image并且调用cv.threshold时，它抛出奇怪的数字
6620912
有时候数字会变

6620912
Promise.catch (async)
(anonymous) @ App.tsx:49
commitHookEffectListMount @ react-dom_client.js?v=a95a0b27:16902
commitPassiveMountOnFiber @ react-dom_client.js?v=a95a0b27:18150
commitPassiveMountEffects_complete @ react-dom_client.js?v=a95a0b27:18123
commitPassiveMountEffects_begin @ react-dom_client.js?v=a95a0b27:18113
commitPassiveMountEffects @ react-dom_client.js?v=a95a0b27:18103
flushPassiveEffectsImpl @ react-dom_client.js?v=a95a0b27:19484
flushPassiveEffects @ react-dom_client.js?v=a95a0b27:19441
commitRootImpl @ react-dom_client.js?v=a95a0b27:19410
commitRoot @ react-dom_client.js?v=a95a0b27:19271
performSyncWorkOnRoot @ react-dom_client.js?v=a95a0b27:18889
flushSyncCallbacks @ react-dom_client.js?v=a95a0b27:9133
flushSync @ react-dom_client.js?v=a95a0b27:18953
finishEventHandler @ react-dom_client.js?v=a95a0b27:3567
batchedUpdates @ react-dom_client.js?v=a95a0b27:3580
dispatchEventForPluginEventSystem @ react-dom_client.js?v=a95a0b27:7174
dispatchEventWithEnableCapturePhaseSelectiveHydrationWithoutDiscreteEventReplay @ react-dom_client.js?v=a95a0b27:5476
dispatchEvent @ react-dom_client.js?v=a95a0b27:5470
dispatchDiscreteEvent @ react-dom_client.js?v=a95a0b27:5447

StackBlitz

import { FC, useEffect, useRef, useState } from 'react'

declare const cv: any

const Canvas = (width: number, height: number) => {
    const canvas = document.createElement('canvas')

    canvas.width = width
    canvas.height = height

    return canvas
}

const App: FC = () => {
    const [OriginalImage, SetOriginalImage] = useState<string>('')

    const PreviewCanvasRef = useRef<HTMLCanvasElement>(null)

    useEffect(() => {
        if (!OriginalImage) return

        const asyncWrapper = async () => {
            if (!PreviewCanvasRef.current) return

      const image = await new Promise<HTMLImageElement>(resolve => {
        const img = new Image()

        img.onload = () => resolve(img)
        img.src = OriginalImage
      })

            const canvas = Canvas(image.width, image.height)

            const ctx = canvas.getContext('2d')

            ctx?.drawImage(image, 0, 0)

            const rawImage = cv.imread(canvas)
            const tresholdImage = new cv.Mat()

            cv.threshold(rawImage, tresholdImage, 0, 255, cv.THRESH_OTSU)

            cv.imshow(PreviewCanvasRef.current, tresholdImage)

            rawImage.delete()
            tresholdImage.delete()
        }

        asyncWrapper().catch(console.error)
    }, [OriginalImage])

    return (
        <div>
            <input
                type='file'
                name='file'
                accept='image/*'
                onChange={event => {
                    SetOriginalImage(prev => {
                        if (!event.target.files?.[0]) return prev

                        if (prev) URL.revokeObjectURL(prev)

                        return URL.createObjectURL(event.target.files[0])
                    })
                }}
            />
            <img alt='Original input' src={OriginalImage} />

            <canvas ref={PreviewCanvasRef} />
        </div>
    )
}

export default App