test/amis2
1
0
Fork 0
mirror of https://gitee.com/baidu/amis.git synced 2024-11-30 02:58:05 +08:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

Merge pull request #9079 from sqzhou/fix/richtext/bug

Browse Source 
fix: 修复rich-text更新挂载异常问题
This commit is contained in:
Allen 2023-12-08 17:01:22 +08:00 committed by GitHub
commit 2ae514474f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 16 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
packages/amis-ui/src/components/RichText.tsx
View File

@ -5,6 +5,7 @@
*/ */
import React from 'react'; import React from 'react';
import isEqual from 'lodash/isEqual';
// @ts-ignore // @ts-ignore
import FroalaEditor from 'froala-editor'; import FroalaEditor from 'froala-editor';
@ -93,11 +94,10 @@ class FroalaEditorComponent extends React.Component<FroalaEditorComponentProps>
} }
componentDidUpdate(prevProps: Readonly<FroalaEditorComponentProps>) { componentDidUpdate(prevProps: Readonly<FroalaEditorComponentProps>) {
if (this.props.config !== prevProps.config) { if (!isEqual(this.props.config, prevProps.config)) {
this.editor?.destroy(); this.destroyEditor();
this.config = this.clone(this.props.config || this.config); this.createEditor();
this.config = {...this.config}; return;
this.editor = new FroalaEditor(this.element, this.config);
} }
if (JSON.stringify(this.oldModel) == JSON.stringify(this.props.model)) { if (JSON.stringify(this.oldModel) == JSON.stringify(this.props.model)) {

3
packages/amis-ui/src/components/Tinymce.tsx
View File

@ -42,6 +42,7 @@ import 'tinymce/plugins/help/js/i18n/keynav/en';
import 'tinymce/plugins/help/js/i18n/keynav/de'; import 'tinymce/plugins/help/js/i18n/keynav/de';
import {LocaleProps, autobind} from 'amis-core'; import {LocaleProps, autobind} from 'amis-core';
import isEqual from 'lodash/isEqual';
interface TinymceEditorProps extends LocaleProps { interface TinymceEditorProps extends LocaleProps {
model: string; model: string;
@ -84,7 +85,7 @@ export default class TinymceEditor extends React.Component<TinymceEditorProps> {
this.editor?.setContent((this.currentContent = props.model || '')); this.editor?.setContent((this.currentContent = props.model || ''));
} }
if (this.props.config !== prevProps.config) { if (!isEqual(this.props.config, prevProps.config)) {
tinymce.remove(this.editor); tinymce.remove(this.editor);
this.initTiny(); this.initTiny();
} }

15
packages/amis/src/renderers/Form/InputRichText.tsx
View File

@ -7,6 +7,7 @@ import {
resolveEventData, resolveEventData,
autobind autobind
} from 'amis-core'; } from 'amis-core';
import isEqual from 'lodash/isEqual';
import cx from 'classnames'; import cx from 'classnames';
import {LazyComponent} from 'amis-core'; import {LazyComponent} from 'amis-core';
import {normalizeApi} from 'amis-core'; import {normalizeApi} from 'amis-core';
@ -124,18 +125,20 @@ export default class RichTextControl extends React.Component<
if (finnalVendor === 'froala') { if (finnalVendor === 'froala') {
if ( if (
anyChanged( !isEqual(prevProps.options, props.options) ||
['options', 'editorClass', 'placeholder', 'buttons'], !isEqual(prevProps.editorClass, props.editorClass) ||
prevProps, !isEqual(prevProps.placeholder, props.placeholder) ||
props !isEqual(prevProps.buttons, props.buttons)
)
) { ) {
this.setState({ this.setState({
config: this.getConfig(props) config: this.getConfig(props)
}); });
} }
} else if (finnalVendor === 'tinymce') { } else if (finnalVendor === 'tinymce') {
if (anyChanged(['options', 'fileField'], prevProps, props)) { if (
!isEqual(prevProps.options, props.options) ||
!isEqual(prevProps.fileField, props.fileField)
) {
this.setState({ this.setState({
config: this.getConfig(props) config: this.getConfig(props)
}); });