vue2.0项目中使用Ueditor富文本编辑器应用中出现的问题

1、如何设置config中的内容

readonly:true,//只读模式wordCount:false,//是否开启字数统计enableAutoSave: false,//自动保存功能

重点:enableAutoSave不一定生效,怎么办?

ueditor.config.js文件中设置enableAutoSave参数为false就可以关闭本地保存功能。

//启用自动保存
 ,enableAutoSave: false

ueditor1.4.3版本是没有效果的,需要修改代码,在ueditor1.5.0版本已经得到修复。

修改方法
ueditor.all.js文件

找到

// plugins/autosave.js
UE.plugin.register(‘autosave‘, function (){

var me = this,
        //无限循环保护
        lastSaveTime = new Date(),
        //最小保存间隔时间
        MIN_TIME = 20,
        //auto save key
        saveKey = null;

function save ( editor ) {

var saveData;

if ( new Date() – lastSaveTime < MIN_TIME ) {
            return;
        }

if ( !editor.hasContents() ) {
            //这里不能调用命令来删除, 会造成事件死循环
            saveKey && me.removePreferences( saveKey );
            return;
        }

lastSaveTime = new Date();

editor._saveFlag = null;

saveData = me.body.innerHTML;

if ( editor.fireEvent( "beforeautosave", {
            content: saveData
        } ) === false ) {
            return;
        }

me.setPreferences( saveKey, saveData );

editor.fireEvent( "afterautosave", {
            content: saveData
        } );

}

return {
        defaultOptions: {
            //默认间隔时间
            saveInterval: 500
        },
        bindEvents:{
            ‘ready‘:function(){

var _suffix = "-drafts-data",
                    key = null;

if ( me.key ) {
                    key = me.key + _suffix;
                } else {
                    key = ( me.container.parentNode.id || ‘ue-common‘ ) + _suffix;
                }

//页面地址+编辑器ID 保持唯一
                saveKey = ( location.protocol + location.host + location.pathname ).replace( /[.:\/]/g, ‘_‘ ) + key;

},

‘contentchange‘: function () {
               //新增加的代码
                if (!me.getOpt(‘enableAutoSave‘)) {
                    return;
                }

if ( !saveKey ) {
                    return;
                }

if ( me._saveFlag ) {
                    window.clearTimeout( me._saveFlag );
                }

if ( me.options.saveInterval > 0 ) {

me._saveFlag = window.setTimeout( function () {

save( me );

}, me.options.saveInterval );

} else {

save(me);

}

}
        },
        commands:{
            ‘clearlocaldata‘:{
                execCommand:function (cmd, name) {
                    if ( saveKey && me.getPreferences( saveKey ) ) {
                        me.removePreferences( saveKey )
                    }
                },
                notNeedUndo: true,
                ignoreContentChange:true
            },

‘getlocaldata‘:{
                execCommand:function (cmd, name) {
                    return saveKey ? me.getPreferences( saveKey ) || ‘‘ : ‘‘;
                },
                notNeedUndo: true,
                ignoreContentChange:true
            },

‘drafts‘:{
                execCommand:function (cmd, name) {
                    if ( saveKey ) {
                        me.body.innerHTML = me.getPreferences( saveKey ) || ‘<p>‘+domUtils.fillHtml+‘</p>‘;
                        me.focus(true);
                    }
                },
                queryCommandState: function () {
                    return saveKey ? ( me.getPreferences( saveKey ) === null ? -1 : 0 ) : -1;
                },
                notNeedUndo: true,
                ignoreContentChange:true
            }
        }
    }

});

以下是新增加的代码
if (!me.getOpt(‘enableAutoSave‘)) {
    return;
}

ueditor1.4.3版本自动保存关闭不了
https://github.com/fex-team/ueditor/issues/470

已在1.5.0分支修改
https://github.com/fex-team/ueditor/blob/dev-1.5.0/_src/plugins/autosave.js#L71-73

原文地址:https://www.cnblogs.com/warter00774/p/8665135.html

时间: 2024-11-06 12:49:22

vue2.0项目中使用Ueditor富文本编辑器应用中出现的问题的相关文章

WEB项目中使用UEditor(富文本编辑器)

Ueditor富文本编辑器是在很多项目里经常用到的框架,是百度开发团队开发的一款很好用的富文本编辑器 下面就是我在一个系统里用到的,有了富文本编辑器,管理员使用起来不是很方便? 所以本博客介绍这个富文本编辑器的使用哈!觉得写得不错的请点赞哈,有建议欢迎提哈!^V^ 下载链接:http://ueditor.baidu.com/website/download.html 具体的使用请看官网:http://ueditor.baidu.com/website/index.html 下载富文本编辑器后,我

ASP.NET MVC5 中百度ueditor富文本编辑器的使用

随着网站信息发布内容越来越多,越来越重视美观,富文本编辑就是不可缺少的了,众多编辑器比较后我选了百度的ueditor富文本编辑器. 百度ueditor富文本编辑器分为两种一种是完全版的ueditor,另一种是ueditor的迷你版umeditor. 一.我们先讲完全版的ueditor. 1.建立数据模型. 2.建立对应的控制器和视图. 3.访问http://ueditor.baidu.com/website/download.html 进入开发版的下载页面,下载.net UTF-8版本,现在最新

vue2.0项目中使用Ueditor富文本编辑器示例

最近在vue项目中需要使用富文本编辑器,于是将Ueditor集成进来,作为公共组件.在线预览:https://suweiteng.github.io/vue2-management-platform/#/editor项目地址:https://github.com/suweiteng/vue2-management-platform 记得在右上角点个赞哦~ 1.放入静态资源并配置 首先把官网下载的Ueditor资源,放入静态资源src/static中.修改ueditor.config.js中的wi

ASP.NET MVC 中使用 UEditor 富文本编辑器

在上篇<使用ASP.NET MVC+Entity Framework快速搭建博客系统>中,已经基本上可以实现博客分类和博客文章的CURD.但是,文章编辑界面实在是-- 好吧,咱得搞专业点.来个传说中的富文本编辑器,度娘了一下,发现 KISSY Editor 和 UEditor 貌似比较简单的样子,既然这样就用百度的 UEditor 吧,到这里下载最新的.NET版. 解压后,将默认目录名称改为 ueditor 然后复制到项目的 Content 目录中,大概就像下图中的样子 打开~/Views/P

Vue 中使用UEditor富文本编辑器-亲测可用-vue-ueditor-wrap

其中UEditor中也存在不少错误,再引用过程中. 但是UEditor相对还是比较好用的一个富文本编辑器. vue-ueditor-wrap说明 Vue + UEditor + v-model 双向绑定.之所以有这个 repo 的原因是: ?1.UEditor 依然是国内使用频率极高的所见即所得编辑器而 Vue 又有着广泛的使用,所以将两者结合使用,是很多 Vue 项目开发者的切实需求. ?2.目前没有发现满足这种需求,而使用又很方便的 repo.有的可能也只是简单的暴露一个 UEditor 的

在网站中使用UEditor富文本编辑器

UEditor是由百度WEB前端研发部开发的所见即所得的开源富文本编辑器,具有轻量.可定制.用户体验优秀等特点. 官网链接 进入到下载页面,选择相应的版本下载 这里我们使用ASP.NET开发,所以选择.NET版本. 将文件解压后,目录结构如下: 将外部js引入到页面中 <script src="Assets/js/ueditor/ueditor.config.js" type="text/javascript"></script> <s

在Vue2.0中集成UEditor 富文本编辑器

在vue的'项目中遇到了需要使用富文本编辑器的需求,在github上看了很多vue封装的editor插件,很多对图片上传和视频上传的支持并不是很好,最终还是决定使用UEditor. 这类的文章网上有很多,我进行了摸索.手写代码.汇总.排版,形成了这篇文章. 下载对应的UEditor源码 首先,去官网上下载UEditor的源码,根据你后台语言的不同下载对应的版本(PHP.Asp..Net.Jsp),下载地址. 下载之后,把资源放到 /static/ue/ 静态目录下.文档结构如下: (我把UEdi

django之百度Ueditor富文本编辑器后台集成

Python3 + Django2.0 百度Ueditor 富文本编辑器的集成 百度富文本编辑器官网地址:http://fex.baidu.com/ueditor/ 疑问:为什么要二次集成? 答案:因为百度富文本编辑器Ueditor没有对python的支持 步骤1: 在官网下载Ueditor的任意版本代码:http://ueditor.baidu.com/website/download.html#ueditor 步骤2: 将下载的代码放入到 django 项目中 步骤3:前端引用 在前端HTM

PHP如何搭建百度Ueditor富文本编辑器

本文为大家分享了PHP搭建百度Ueditor富文本编辑器的方法,供大家参考,具体内容如下 下载UEditor 官网:下载地址 将下载好的文件解压到thinkphp项目中,本文是解压到PUBLIC目录下并改文件夹名称为ueditor 第一步 引入javascript 在html中如入下面的js语句引入相关文件 ? 1 2 <script type="text/javascript" charset="utf-8" src="__PUBLIC__/ued