El siguiente enlace explica cómo personalizar el complemento (@toast-ui/editor), pero no sé cómo implementarlo en vue (@toast-ui/vue-editor).

tutorial-example15-customizing-toolbar-buttons (componente de JavaScript simple)

Tostadas de la página de GitHub-ui

Código incompleto en vue:

 import '@toast-ui/editor/dist/toastui-editor.css' import { Editor } from '@toast-ui/vue-editor' export default { name: 'TextEditor', methods:{ createLastButton: function(){ const button = document.createElement('button'); button.className = 'toastui-editor-toolbar-icons last'; button.style.backgroundImage = 'none'; button.style.margin = '0'; button.innerHTML = `<i>Bold</i>`; button.addEventListener('click', () => { Editor.exec('bold'); }); return button; }, }, data () { return { editorText:'', editorOpttions:{ minHeight: '200px', language: 'en-US', useCommandShortcut: true, usageStatistics: true, hideModeSwitch: false, toolbarItems: [ ['heading', 'bold', 'italic', 'strike'], ['hr', 'quote'], ['ul', 'ol', 'task', 'indent', 'outdent'], ['table', 'image', 'link'], ['code', 'codeblock'], ['scrollSync'], // Using Option: Customize the last button [{ el: this.createLastButton(), command: 'bold', tooltip: 'Custom Bold' }] ] }, } }, components: { 'editor': Editor }, };

He hecho esta implementación hasta cierto punto, pero no sé cómo implementar el siguiente fragmento de código en vue

 editor.insertToolbarItem({ groupIndex: 0, itemIndex: 0 }, { name: 'myItem', tooltip: 'Custom Button', command: 'bold', text: '@', className: 'toastui-editor-toolbar-icons first', style: { backgroundImage: 'none' } });