vue中使用ueditor

参考https://codechina.csdn.net/mirrors/haochuan9421/vue-ueditor-wrap?utm_source=csdn_github_accelerator

下载ueditor文件(cli2.0放到static文件夹下,cli3放到public下)

安装:  npm i vue-ueditor-wrap

<template>
    <VueUeditorWrap v-model="addForm.content" :config="myConfig" @ready="ready"></VueUeditorWrap>
</template>
<script>
    import '../../../public/UEditor/ueditor.config'
    import '../../../public/UEditor/ueditor.all.min'
    import '../../../public/UEditor/lang/zh-cn/zh-cn.js'
    import '../../../public/UEditor/ueditor.parse.js'
    import '../../../public/UEditor/themes/default/css/ueditor.min.css'

    import VueUeditorWrap from "vue-ueditor-wrap";


    export default {
        data(){
                return{
                    
                    myConfig: {
                        // 编辑器不自动被内容撑高
                        autoHeightEnabled: true,
                        // 初始容器高度
                        initialFrameHeight: 500,
                        // 初始容器宽度
                        initialFrameWidth: '100%',
                        // 上传文件接口(后台接口返回的配置文件接口,此处设置以后将不必再修改ueditor文件中的serverUrl)
                        serverUrl: 'http://xx.xx.xx/config',
                        // UEditor 静态资源文件的存放路径,
                        UEDITOR_HOME_URL: '/UEditor/'
                    },
                }
        },
        methods:{
            ready (editorInstance) {
                console.log(`编辑器实例${editorInstance.key}: `, editorInstance)
            },
        }
    }
</script>                                                    

  

  

posted @ 2020-12-29 17:29  番茄西红柿u  阅读(352)  评论(0编辑  收藏  举报