在vue中完美使用ueditor组件(cdn)

前言:无需main.js或页面全局或局部引入,直接使用cdn将ueditor作为vue组件 

请直接创建vue文件,作为组件使用。复制粘贴,即可直接使用(此篇只展示前端代码,后端大家自由选择,图片资源存放建议使用阿里云oss或者七牛云对象存储)

component组件代码:




在使用页面

import Editor from '你的component路径/Editor.vue'

使用代码:



                 
     




import Editor from '你的component路径/Editor.vue'
export default {
    data(){
        return {
            ueditorStyle: {//ueditor样式
              width: '100%',
              height: '200px'
            },
        }
    },
    components:{
        Editor
    },
    methods:{
      editorReady (editor) {//保存ueditor内容
        this.editor = editor
        if (this.$router.currentRoute.params.id > 0) this.fetch()
        editor.addListener('afterAutoSave', () => {
          this.prize.data.description = editor.getContent()
        })
      },
    },
}



this.editor.setContent(编辑框内的数据)//设置ueditor框内内容,在编辑时使用

 

你可能感兴趣的:(vue)