diff --git a/README.md b/README.md index 5857c39..5a5d496 100644 --- a/README.md +++ b/README.md @@ -267,6 +267,11 @@ const editor = new EasyMDE({ preview.innerHTML = customMarkdownParser(plainText); }, 250); + // If you return null, the innerHTML of the preview will not + // be overwritten. Useful if you control the preview node's content via + // vdom diffing. + // return null; + return "Loading..."; }, promptURLs: true, diff --git a/src/js/easymde.js b/src/js/easymde.js index 2d9c784..fd36247 100644 --- a/src/js/easymde.js +++ b/src/js/easymde.js @@ -1072,7 +1072,11 @@ function togglePreview(editor) { toolbar_div.classList.add('disabled-for-preview'); } } - preview.innerHTML = editor.options.previewRender(editor.value(), preview); + + var preview_result = editor.options.previewRender(editor.value(), preview); + if (preview_result !== null) { + preview.innerHTML = preview_result; + } } @@ -2860,7 +2864,11 @@ EasyMDE.prototype.value = function (val) { if (this.isPreviewActive()) { var wrapper = cm.getWrapperElement(); var preview = wrapper.lastChild; - preview.innerHTML = this.options.previewRender(val, preview); + var preview_result = this.options.previewRender(val, preview); + if (preview_result !== null) { + preview.innerHTML = preview_result; + } + } return this; } diff --git a/types/easymde.d.ts b/types/easymde.d.ts index ab8f0ca..decd4ca 100644 --- a/types/easymde.d.ts +++ b/types/easymde.d.ts @@ -196,7 +196,7 @@ declare namespace EasyMDE { previewClass?: string | ReadonlyArray; previewImagesInEditor?: boolean; imagesPreviewHandler?: (src: string) => string, - previewRender?: (markdownPlaintext: string, previewElement: HTMLElement) => string; + previewRender?: (markdownPlaintext: string, previewElement: HTMLElement) => string | null; promptURLs?: boolean; renderingConfig?: RenderingOptions; shortcuts?: Shortcuts;