Свойство данных Vue set внутри конструктора редактора tiptap

Возникли проблемы с установкой значения editorView внутри onInit метод при создании нового Editorпример. Поскольку вызов вложен в два метода, я не уверен, как получить доступ к экземпляру Vue, чтобы правильно установитьeditorView.

data: function() {
    return {
        editor: new Editor({
            onInit: ({ state, view }) => {
                this.editorView = view
            },
        }),
        editorView: null,
    }
},

2 ответа

Я обнаружил эту библиотеку под названием tiptap, и в соответствии с ее событиями вы могли сделать это следующим образом:

data: function() {
    return {
        editor: new Editor(),
        editorView: null,
    }
},
mounted(){
 this.editor.on('init', ({ state, view }) => {
   this.editorView = view
})
}

Или

data: function() {
    return {
        editor: null,
        editorView: null,
    }
},
mounted(){
 let that=this;
 this.editor=new Editor({
            onInit: ({ state, view }) => {
                that.editorView = view
            },
        })
}

поскольку this относится к Editor пример не Vue один

Хотя это и не идеально, временное исправление - перетащить инициализацию внутри mountedи сохраните экземпляр Vue во временную переменную. Если у кого-то есть способ получить доступ к экземпляру Vue из обратного вызова init внутри исходного конструктора, я был бы признателен. Благодарность!

    mounted: function() {
        this.initializeEditor() 
    },
    methods: {
        initializeEditor() {
            var self = this
            this.editor = new Editor({
                onInit: ({ state, view }) => {
                    console.log('Editor Initialized.')
                    console.log('Editor view: ')
                    self.editorView = view
                },
            })
        },
    }
Другие вопросы по тегам