Javascript tiptap编辑器构造函数中的Vue设置数据属性

创建新的

编辑器

实例时，在

onInit

方法内部设置

editorView

的值时遇到问题。因为调用嵌套在两个方法的深处，所以我不确定如何访问Vue实例以正确设置

editorView

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

---

我是来发现这个名为的图书馆的，根据它的特点，你可以这样做：

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

或

---

由于

此

引用了

编辑器

实例，而不是

Vue

一个

，尽管不理想，临时修复方法是将

mounted

中的初始化拉入并将Vue实例存储到临时变量。如果有人能够从原始构造函数中的init回调访问Vue实例，我将不胜感激。谢谢

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

---

事实上，这应该行得通。箭头函数捕获了

this

，它应该是您的组件。如果在回调中设置断点，调试器会说什么？

onInit

是否可能作为构造函数的一部分运行？在这种情况下，Vue还没有机会将该属性转换为被动属性。感谢您的回复。不幸的是，回调从未被触发。知道为什么吗？就像我说的我是来发现这个工具的，我想建议另一个解决方案

让它=这个

是一种丑陋的做法，使用bind（）但是如果将其绑定到回调，如何访问编辑器实例？这是最好的方法，因为您不能用另一个实例更新数据属性，因为它们在同一时间初始化，

回调中的此

指的是编辑器实例而不是vue实例，我在下面的回答中添加了这一点

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