提交 fb43fad5 编写于 作者: 无木

fix(tinymce): fixed `tinymce` destory method

修复tinymce销毁方法可能出现异常的问题
上级 8e013774
...@@ -19,7 +19,7 @@ ...@@ -19,7 +19,7 @@
</template> </template>
<script lang="ts"> <script lang="ts">
import type { RawEditorSettings } from 'tinymce'; import type { Editor, RawEditorSettings } from 'tinymce';
import tinymce from 'tinymce/tinymce'; import tinymce from 'tinymce/tinymce';
import 'tinymce/themes/silver'; import 'tinymce/themes/silver';
import 'tinymce/icons/default/icons'; import 'tinymce/icons/default/icons';
...@@ -60,8 +60,8 @@ ...@@ -60,8 +60,8 @@
ref, ref,
unref, unref,
watch, watch,
onUnmounted,
onDeactivated, onDeactivated,
onBeforeUnmount,
} from 'vue'; } from 'vue';
import ImgUpload from './ImgUpload.vue'; import ImgUpload from './ImgUpload.vue';
import { toolbar, plugins } from './tinymce'; import { toolbar, plugins } from './tinymce';
...@@ -114,9 +114,9 @@ ...@@ -114,9 +114,9 @@
components: { ImgUpload }, components: { ImgUpload },
inheritAttrs: false, inheritAttrs: false,
props: tinymceProps, props: tinymceProps,
emits: ['change', 'update:modelValue'], emits: ['change', 'update:modelValue', 'inited', 'init-error'],
setup(props, { emit, attrs }) { setup(props, { emit, attrs }) {
const editorRef = ref(); const editorRef = ref<Nullable<Editor>>(null);
const fullscreen = ref(false); const fullscreen = ref(false);
const tinymceId = ref<string>(buildShortUUID('tiny-vue')); const tinymceId = ref<string>(buildShortUUID('tiny-vue'));
const elRef = ref<Nullable<HTMLElement>>(null); const elRef = ref<Nullable<HTMLElement>>(null);
...@@ -165,7 +165,7 @@ ...@@ -165,7 +165,7 @@
content_css: content_css:
publicPath + 'resource/tinymce/skins/ui/' + skinName.value + '/content.min.css', publicPath + 'resource/tinymce/skins/ui/' + skinName.value + '/content.min.css',
...options, ...options,
setup: (editor) => { setup: (editor: Editor) => {
editorRef.value = editor; editorRef.value = editor;
editor.on('init', (e) => initSetup(e)); editor.on('init', (e) => initSetup(e));
}, },
...@@ -194,9 +194,7 @@ ...@@ -194,9 +194,7 @@
); );
onMountedOrActivated(() => { onMountedOrActivated(() => {
if (initOptions.value.inline) { if (!initOptions.value.inline) {
tinymceId.value = unref(initOptions).selector!;
} else {
tinymceId.value = buildShortUUID('tiny-vue'); tinymceId.value = buildShortUUID('tiny-vue');
} }
nextTick(() => { nextTick(() => {
...@@ -206,7 +204,7 @@ ...@@ -206,7 +204,7 @@
}); });
}); });
onUnmounted(() => { onBeforeUnmount(() => {
destory(); destory();
}); });
...@@ -216,7 +214,7 @@ ...@@ -216,7 +214,7 @@
function destory() { function destory() {
if (tinymce !== null) { if (tinymce !== null) {
tinymce?.remove?.(tinymceId.value as string); tinymce?.remove?.(unref(initOptions).selector!);
} }
} }
...@@ -225,7 +223,14 @@ ...@@ -225,7 +223,14 @@
if (el) { if (el) {
el.style.visibility = ''; el.style.visibility = '';
} }
tinymce.init(unref(initOptions)); tinymce
.init(unref(initOptions))
.then((editor) => {
emit('inited', editor);
})
.catch((err) => {
emit('init-error', err);
});
} }
function initSetup(e) { function initSetup(e) {
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册