Подъем экземпляра редактора TiptAp в магазин Pinia Store ⇐ Javascript

[Anonymous]

У меня очень простая настройка редактора TiptAp в Vuejs, что -то вроде этого:
// tiptap.vue






// Imports
const editor = ref(null)

onMounted(() => {
editor.value = new Editor({
editable: true,
extensions: [
StarterKit
],
content: props.modelValue,
})
})

< /code>
И это работает нормально, но когда я хочу централизовать свое состояние в магазине Pinia, чтобы я мог проверить государство редакторов или назвать его методы из разных компонентов, например, так :
// editorstore.js
export const useEditorStore = defineStore('editor', () => {
const editorRef = ref(null)
const textEditorContent = ref('')

const initializeEditor = () => {
editorRef.value = new Editor({
editable: true,
extensions: [
StarterKit
],
content: textEditorContent.value,
})
}
})








const editorStore = useEditorStore()
const editor = editorStore.editorRef
onMounted(() => {
editorStore.initializeEditor()
})
< /code>
он либо нарушает реактивность < /p>

При использовании const editor = mallowref (null) в магазине < /li>
< /ul>
или создает слишком много рекурсии < /p>

При использовании const editor = ref (null) < /li >
< /ul>
Я чувствую, что мне не хватает критической логики, когда речь идет о реактивности /управлении состоянием здесь.
Что может быть проблемой? < /p>

Подробнее здесь: https://stackoverflow.com/questions/794 ... inia-store