Vue 之vue-ueditor-wrap富文本編輯器自定義按鈕

一、效果圖

 

 二、代碼

<vue-ueditor-wrap v-model="form.content" @ready="ready" :config="editorConfig" @beforeInit="addImageButton" style="line-height: initial;"></vue-ueditor-wrap>

import VueUeditorWrap from 'vue-ueditor-wrap'

addImageButton(editorId){
    window.UE.registerUI('myinsertimage', (editor, uname) => {
        const btn = new window.UE.ui.Button({
            name: uname,
            title: '單圖上傳',
            cssRules: '按鈕樣式',
            onclick: function(){
                _this.img_type = 'ueditor'
                _this.$refs['image_child'].$emit('show_image_dialog')
            })
        return btn
    })
}