diff options
author | Ferdinand Thiessen <rpm@fthiessen.de> | 2022-06-29 21:06:43 +0300 |
---|---|---|
committer | Jonas <jonas@freesources.org> | 2022-07-04 10:43:05 +0300 |
commit | d26ed3222cfe338d111a3d4b673c2043930c05d5 (patch) | |
tree | 38a5e3603389b5084c8749ef8df67d3b5afef408 /src/components | |
parent | 014f73fced8c39475f5cc1be9fdcef75e23a5172 (diff) |
BaseReader: Use a factory pattern for creating the extension list
Provide functions are neither called on the providing object nor
on the injecting object, so using `this` within provided functions
will refer to the global `this` for which `$emit` is not defined.
This uses a factory pattern so that `this` is bound to the injecting
object.
Also forwarding the `click-link` event is needed.
Signed-off-by: Ferdinand Thiessen <rpm@fthiessen.de>
Diffstat (limited to 'src/components')
-rw-r--r-- | src/components/BaseReader.vue | 3 | ||||
-rw-r--r-- | src/components/PlainTextReader.vue | 2 | ||||
-rw-r--r-- | src/components/RichTextReader.vue | 20 |
3 files changed, 15 insertions, 10 deletions
diff --git a/src/components/BaseReader.vue b/src/components/BaseReader.vue index 1f48b1f60..6b0e81a74 100644 --- a/src/components/BaseReader.vue +++ b/src/components/BaseReader.vue @@ -31,6 +31,7 @@ import { EditorContent } from '@tiptap/vue-2' export default { name: 'BaseReader', components: { EditorContent }, + // extensions is a factory building a list of extensions for the editor inject: ['renderHtml', 'extensions'], props: { @@ -65,7 +66,7 @@ export default { createEditor() { return new Editor({ content: this.htmlContent, - extensions: this.extensions, + extensions: this.extensions(), }) }, diff --git a/src/components/PlainTextReader.vue b/src/components/PlainTextReader.vue index 6d2ccf7a7..5d01acad7 100644 --- a/src/components/PlainTextReader.vue +++ b/src/components/PlainTextReader.vue @@ -37,7 +37,7 @@ export default { renderHtml(content) { return '<pre>' + escapeHtml(content) + '</pre>' }, - extensions: [PlainText], + extensions: () => [PlainText], }, props: { diff --git a/src/components/RichTextReader.vue b/src/components/RichTextReader.vue index 8107ad2f9..68eaf633c 100644 --- a/src/components/RichTextReader.vue +++ b/src/components/RichTextReader.vue @@ -21,7 +21,7 @@ --> <template> - <BaseReader :content="content" /> + <BaseReader :content="content" @click-link="(e, a) => $emit('click-link', e, a)" /> </template> <script> @@ -37,13 +37,17 @@ export default { renderHtml(content) { return markdownit.render(content) }, - extensions: [ - RichText.configure({ - link: { - onClick: (event, attrs) => this.$emit('click-link', event, attrs), - }, - }), - ], + extensions() { + return [ + RichText.configure({ + link: { + onClick: (event, attrs) => { + this.$emit('click-link', event, attrs) + }, + }, + }), + ] + }, }, props: { |