TipTap Vue component - как переключить перенос узла с помощью кнопки компонента
Замечательная оболочка tiptap для prosemirror поставляется с хорошей документацией, но в ней отсутствуют некоторые разъяснения, как подходить к некоторым (я думаю) базовым сценариям при разработке пользовательских расширений.
Мой вопрос в том, как вызвать toggleWrap на узле в контексте компонента vue. Я нашел пример, который использует транзакции и позволяет удалять, но я хочу очистить узел, оставив текст узла нетронутым.
get view() {
return {
directives: {
"click-outside": clickOutside
},
props: ['node', 'updateAttrs', 'view', 'selected', 'getPos'],
data() {
return {
showMenu: false
}
},
computed: {
href: {
get() {
return this.node.attrs.href
},
set(href) {
this.updateAttrs({
href,
})
},
},
},
methods: {
// deleteNode() {
// let transaction = this.view.state.tr // tr - transaction
// let pos = this.getPos()
// transaction.delete(pos, pos + this.node.nodeSize)
// this.view.dispatch(transaction)
// },
stopLinkPropagation(){
return null;
},
hideMenu(){
this.showMenu = false
}
},
template: `<div @click="showMenu = true" v-click-outside="hideMenu">
<a class="email-button" @click.prevent="stopLinkPropagation" :href="href" v-text="node.textContent"></a>
<input class="iframe__input" type="text" v-model="href" v-if="showMenu" />
<button @click="clearNode">clear button wrap</button>
</div>`,
}
}
Любая помощь была бы потрясающей. Спасибо.