fix: fix React Node View render problem in React 18 (#2985)

This commit is contained in:
Cai Huanyu 2022-08-22 20:41:26 +08:00 committed by GitHub
parent de1253a8b0
commit f32293b0d5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -1,5 +1,6 @@
import { Editor } from '@tiptap/core'
import React from 'react'
import { flushSync } from 'react-dom'
import { Editor as ExtendedEditor } from './Editor'
@ -77,14 +78,16 @@ export class ReactRenderer<R = unknown, P = unknown> {
this.reactElement = <Component {...props } />
if (this.editor?.contentComponent) {
this.editor.contentComponent.setState({
renderers: this.editor.contentComponent.state.renderers.set(
this.id,
this,
),
})
}
flushSync(() => {
if (this.editor?.contentComponent) {
this.editor.contentComponent.setState({
renderers: this.editor.contentComponent.state.renderers.set(
this.id,
this,
),
})
}
})
}
updateProps(props: Record<string, any> = {}): void {
@ -97,14 +100,16 @@ export class ReactRenderer<R = unknown, P = unknown> {
}
destroy(): void {
if (this.editor?.contentComponent) {
const { renderers } = this.editor.contentComponent.state
flushSync(() => {
if (this.editor?.contentComponent) {
const { renderers } = this.editor.contentComponent.state
renderers.delete(this.id)
renderers.delete(this.id)
this.editor.contentComponent.setState({
renderers,
})
}
this.editor.contentComponent.setState({
renderers,
})
}
})
}
}