富文本编辑器wangEditor回显问题
- 回显时渲染dom报错问题:
富文本编辑器在回显html时偶尔会报以下错误:
Error in v-on handler: "Error: Cannot find a descendant at path [1,1,0] in node: {“children”:[],“operations”:[{“type”:“remove_node”,“path”:[0],“node”:
这个问题在github也提issues了,目前靠谱的解决方法为在关闭dialog时同时销毁富文本编辑器,让dialog与富文本编辑器同时v-if绑定同一个变量即可。
<div v-if="dialogFormVisible" style="border: 1px solid #ccc;"><Toolbarstyle="border-bottom: 1px solid #ccc":editor="editor":defaultConfig="toolbarConfig":mode="mode"/><Editorstyle="height: 500px; overflow-y: hidden;"v-model="html":defaultConfig="editorConfig":mode="mode"@onCreated="onCreated"/></div>
- 添加时存在缓存,此时单单控制富文本的v-if无效,必须要连同dialog一起销毁,此时控制dialog显示的变量要放在组件上
<add-or-update ref="addOrUpDataRef" @getList="getList" v-if="diaShow" @close="diaShow = false"/>
富文本存在于add-or-update组件中,如果在这个组件里用变量控制一个dialog就会出现上述问题,此时直接让dialog的visable为true,然后将控制是否隐藏显示标识在最外层,这样每次弹窗都是新创建和销毁组件,可解决缓存问题。
富文本编辑器wangEditor回显问题相关推荐
- django快速集成富文本编辑器wangeditor
django快速集成富文本编辑器wangeditor django是python栈一款优秀的web开发框架,也是python栈web开发框架中使用占比最高的开发框架,至于其是否足够优秀不言自明,自带的 ...
- css wangeditor 修改_HTML富文本编辑器wangEditor的使用
var E = window.wangEditor; var editor = new E('#editor') //配置信息 var config = editor.customConfig; // ...
- 特别好用的前端html富文本编辑器wangEditor个人使用案例
当前为jQuery版本demo,详细Vue组件版本请点此链接:特别好用的Vue富文本编辑器wangEditor自己使用案例组件,附源码,直接使用_膨胀的菜盒的博客-CSDN博客 因公司项目后台管理平台 ...
- 富文本编辑器 wangeditor 的使用
富文本编辑器 wangeditor 的使用 为什么选择使用 wangeditor a. 轻量.简洁.界面美观.文档齐全.易用.开源免费.开源团队维护.有专业Q群答疑.持续更新.无需使用其他库.插件功能 ...
- 富文本编辑器wangEditor的使用(即学即用)
介绍 wangEditor 是一款基于JavaScript和CSS开发的Web富文本编辑器,其具有轻量级.简洁.易用的特点.当然,市面上有许多别的富文本编辑器,各有特点,本文专注于介绍wangEdit ...
- HTML——实现富文本编辑器wangEditor的使用
HTML--实现富文本编辑器wangEditor的使用 文章目录 HTML--实现富文本编辑器wangEditor的使用 一.导入wangEditor.JS 二.直接引用文档链接 三.包管理工具(no ...
- 富文本插件 和回显 vue-quill-editor
在开发过程中,input的限制会越来越明显.这时富文本输入框就派上用场了. 推荐使用这个插件 vue-quill-editor 插件的使用方法和自定义组件的使用方法一样 第一步: 安装插件 npm i ...
- 富文本_轻量级 web 富文本编辑器 —— wangEditor
介绍 wangEditor -- 轻量级 web 富文本编辑器,配置方便,使用简单.支持 IE10+ 浏览器. 官网:www.wangEditor.com 文档:www.kancloud.cn/wan ...
- html——简单文章发布html页面及富文本编辑器wangEditor的使用
实现结果截图: 说明: 1.主要组件使用了bootstrap4,富文本编辑器使用wangEditor,在使用前需要下载wangEditor的js文件,地址参考 wangEditor3使用手册 2.所用 ...
最新文章
- Linux 线程与进程,以及通信
- 14.基于Hadoop的数据仓库Hive第1部分
- vim匹配数字及数量限制
- matlab求系统根轨迹代码_要想正确画出根轨迹,先搞清楚这8大法则再说!
- 云计算系统是大规模计算机系统吗,云计算的系统架构及技术探析
- ZOJ 1450 Minimal Circle 点集的最小圆覆盖
- [css] 手写一个满屏品字布局的方案
- pandas 非聚合函数
- C++学习(三)(C语言部分)之 基本数据类型
- 字符串转换为小数(如String a=“123“),转换之后为123.0
- GBDT(MART) 迭代决策树入门教程 | 简介 写的非常好!!
- 国考计算机怎么评分标准,国考行测的评分标准
- 如何打造高质量的NLP数据集
- 音量控制面板项目说明
- 激光雷达Velodyne16配置及录制rosbag
- 小米watch s2功能介绍 小米watch s2测评值得买吗
- oracle tns远程投毒,Oracle TNS Listener Remote Poisoning 测试
- 计算机控制台程序,什么是电脑控制台,是DOS设定吗?
- 微信开放平台之小程序获取用户信息
- Spring整合MyBatis导致一级缓存失效问题