提交 e3199859 authored 作者: 王鹏飞's avatar 王鹏飞

fix(admin): restore editor feature event routing

上级 1186e57d
import { useEffect, useRef } from 'react'
export const useEditorFeatureEvents = ({ editor, registry, runtime }) => {
const runtimeRef = useRef(runtime)
runtimeRef.current = runtime
useEffect(() => {
if (!editor) return
const listeners = registry.events.map(({ name, handler }) => ({
name,
listener: payload => handler({ editor, payload, runtime: runtimeRef.current }),
}))
listeners.forEach(({ name, listener }) => editor.on(name, listener))
return () => listeners.forEach(({ name, listener }) => editor.off(name, listener))
}, [editor, registry])
}
...@@ -29,6 +29,7 @@ import { EditorSidebar } from './EditorSidebar' ...@@ -29,6 +29,7 @@ import { EditorSidebar } from './EditorSidebar'
import { useEditorLifecycle } from './useEditorLifecycle' import { useEditorLifecycle } from './useEditorLifecycle'
import { useToolbarPresentation } from './useToolbarPresentation' import { useToolbarPresentation } from './useToolbarPresentation'
import { createEditorConfig, defaultEditorContent, toolbarConfig } from './editor-config' import { createEditorConfig, defaultEditorContent, toolbarConfig } from './editor-config'
import { useEditorFeatureEvents } from '../core/useEditorFeatureEvents'
import "../index.less"; import "../index.less";
...@@ -77,6 +78,8 @@ const WangEditorCustomer = (props, ref) => { ...@@ -77,6 +78,8 @@ const WangEditorCustomer = (props, ref) => {
}, },
}) })
useEditorFeatureEvents({ editor, registry: editorFeatureRegistry, runtime: {} })
// 及时销毁 editor ,重要! // 及时销毁 editor ,重要!
useEffect(() => { useEffect(() => {
if (!editor) return if (!editor) return
......
import { render } from '@testing-library/react'
import { createElement } from 'react'
import { describe, expect, it, vi } from 'vitest'
import { useEditorFeatureEvents } from '@/common/wangeditor-customer/core/useEditorFeatureEvents'
describe('useEditorFeatureEvents', () => {
it('subscribes registry menu events to the current editor and cleans them up', () => {
const editor = { on: vi.fn(), off: vi.fn() }
const handler = vi.fn()
const registry = { events: [{ name: 'ImageMenuClick', handler }] }
const Subscriber = () => {
useEditorFeatureEvents({ editor, registry, runtime: {} })
return null
}
const view = render(createElement(Subscriber))
expect(editor.on).toHaveBeenCalledWith('ImageMenuClick', expect.any(Function))
const listener = editor.on.mock.calls[0][1]
listener({ source: 'menu' })
expect(handler).toHaveBeenCalledWith({ editor, payload: { source: 'menu' }, runtime: {} })
view.unmount()
expect(editor.off).toHaveBeenCalledWith('ImageMenuClick', listener)
})
})
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑!
请 注册 或者 后发表评论