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>`,
        }
    }

Любая помощь была бы потрясающей. Спасибо.

0 ответов

Другие вопросы по тегам