TypeError: Cannot read properties of null (reading '_leaflet_disable_click')

TypeError: Cannot read properties of null (reading '_leaflet_disable_click')

我正在使用 react-leafletnextjs 并且我有标记,在这些标记的弹出窗口中有一个按钮可以在单击时打开另一个页面,但是当我打开另一页:

Unhandled Runtime Error
TypeError: Cannot read properties of null (reading '_leaflet_disable_click')

Call Stack
NewClass._isClickDisabled
node_modules/leaflet/dist/leaflet-src.js (4350:0)
NewClass._handleDOMEvent
node_modules/leaflet/dist/leaflet-src.js (4357:0)
HTMLDivElement.handler
node_modules/leaflet/dist/leaflet-src.js (2692:0)

另一个页面的调用工作正常,但是当我没有在任何地方调用 _leaflet_disable_click 并且我不确定它来自哪里时显示此错误:

const handleOpen = (e, entry) => {
        e.preventDefault()
        setFormData({
            id: entry.id,
            topic: entry.topic,
            field: entry.field,
            officer: entry.officer,
            date: entry.date,
            fresh: entry.fresh,
            createdAt: entry.createdAt,
            createdBy: entry.createdBy,
            level: entry.level,
            category: entry.category,
            type: entry.type,
            lat: entry.lat,
            lng: entry.lng,
            expiresAt: entry.expiresAt
        })
        router.push(`?page=${router.query.page}&form=news_form&id=${entry.id}`, undefined, {shallow: true})
    }

您可以通过在触发按钮的点击事件时调用 e.stopPropagation() 来修复它,因此您将在此处添加它:

const handleOpen = (e, entry) => {
        e.stopPropagation()
        e.preventDefault()
        ...
        router.push(`?page=${router.query.page}&form=news_form&id=${entry.id}`, undefined, {shallow: true})
    }

这也将避免双击打开新页面的需要。