【vue】 Tinymce 数据 回显问题 | 第一次正常回显后面，显示空白bug不能编辑

最新推荐文章于 2024-04-25 12:50:07 发布
最新推荐文章于 2024-04-25 12:50:07 发布
阅读量2.2k 收藏 10
点赞数 7
文章标签： vue.js bug 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_46123200/article/details/130102093
版权

Tinymce 数据 回显问题 | 第一次正常回显后面，显示空白bug不能编辑

前端项目框架vue2 ，使用富文本编辑器 tinymce ,在el-dialog回显tinymce数据时第一次是正常回显也可以编辑，但是dialog关闭后 再次点击 tinymce就是空白一片，也无法编辑（如下图）
在这里插入图片描述
看了一下其他人的解释，大概是说 富文本没有销毁

解决方法

在这里插入图片描述

可以看到这里dialog 是否显示绑定的是open，给tinymce加个v-if 也绑定open，让富文本和dialog一同渲染

在这里插入图片描述

后续，富文本就是正常回显与编辑了

下班~

fruge365
关注
  • 7
    点赞
  • 踩
  • 10
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 3
    评论
2021-02-17
qq_41642640的博客
02-17 700
一直用vue-cli创建项目，差点把原生引入vue的写法忘了，刚好项目有个需求就来做个小练习。 首先要先把富文本tinymce-4.7.5的js下载回来。 tinyMCE下载地址:https://www.tiny.cloud/get-tiny/self-hosted/ 其中tinyMCE默认为英文，如需中文需要下载语言扩展包，下载地址：https://www.tiny.cloud/get-tiny/langu...
tinymce离线资源
10-19
解压后将文件夹放在public下面，然后将使用的index.vue里面的tinymceCDN改为'tinymce/tinymce.min.js'
tinymce富文本编辑器的使用（回显问题）
weixin_49861016的博客
09-28 646
tinymce富文本编辑器组件。tinymce富文本编辑器的使用。
(vue)富文本Tinymce + vue 配置与内容回显
nyf_unknow的博客
12-25 1439
【代码】(vue)富文本Tinymce + vue 配置与内容回显。
Vue tinymce富文本回显问题
Mr-k的博客
11-03 3396
问题：对列表的富文本框进行编辑的时候，发现 v-model 无法有效显示，或者说出现空白等bug，不然就是富文本框内的内容是上一次的文本，并且常用的设置方法都无效。富文本框通过赋值方法可以展示，但不具稳定性，通过标签添加 ref 进行绑定后，通过.setContent 方法进行赋值。
tinymce回显问题
LL22222222的博客
10-10 112
tinymce回显
Tinymce + vue 配置与数据回显
baidu_41882081的博客
05-18 1125
每天使用csdn解决问题，也想为社区做个贡献。
Vue tinymce富文本数据回显不了问题
Lzy_o的博客
05-11 1432
tinymce富文本数据回显
2.0 vue2+tinymce+springboot实现图片上传与回显
u013733643的博客
05-25 543
2.0 vue2+tinymce+springboot实现图片上传与回显
tinymce回显时，首次正常，后面回显内容一样
weixin_51972315的博客
03-16 418
tinymce使用时 出现的问题
Vue下拉框回显并默认选中随机问题
12-09
今天做vue的页面下拉框回显问题，回显数据是随机的，好奇怪，虽然多刷新 几下就可以了， 但是这个问题还是存在的，后来发现问题是 回显中的数据是两次请求，因为网络问题两次说不定哪个就请求的快一些， 因为调用的对象不一样，所以可能会不同，改为相同的之后，发现第一次请求的时间始终比第二次时间短一些，达到想要的效果 总结： 1.因为第一次加载下拉框列表的时候，请求列表中所有数据和列表默认回显数据不同，所以会出现被刷新，而出现回显随机问题，，， PS：vue 运用ElementUI,做select下拉框回显 第一、加载的顺序，应该先加载下拉框要选择的数据，然后在通过编辑查询数据后回显。
解决Vue使用bus总线时,第一次路由跳转时数据没成功传递问题
11-20
bus总线是vue中路由跳转传递数据的常用方法，适用于传递数据不多的情况，但是在使用的过程中发现，bus总线在第一次路由跳转的时候总是不能够成功传递需要传递的数据。检查bus的配置以及调用方法，均没有出错，错就错...
解决vue bus.$emit触发第一次$on监听不到问题
10-15
主要介绍了解决vue bus.$emit触发第一次$on监听不到问题，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
VUE 项目 自动按需导入
不想成为可以改变世界的程序员，不是一个好程序员
04-22 507
你是否有这样的苦恼，每个.vue都需要导入所需的vue各个方法 unplugin-auto-import 库 Vite、Webpack和Rollup的按需自动导入API 本章提供Vite、Webpack中使用说明
前端开发攻略---封装calendar日历组件，实现日期多选。可根据您的需求任意调整，可玩性强。
nibabaoo的博客
04-24 1054
封装calendar日历组件，实现日期多选。Vue日历组件封装。Vue3封装日历组件。Vue2封装日历组件
19篇 vue3进阶
hummhumm的专栏
04-20 414
10. **组件定义的分离**：通过 `defineComponent` 方法分离组件逻辑与模板。23. **事件总线 (`provide` / `inject`)**：祖先与后代组件间通信。33. **跨平台支持**：如 `Nativescript-Vue` 或 `Uni-app`。9. **动态组件和 `v-if` / `v-for`**：更灵活地使用这些指令。20. **计算属性 (`computed`)**：创建缓存的计算属性。12. **组件的 `expose` 选项**：显式指定组件公开属性。
vue+element 树形结构 改成懒加载模式(原理element有),这里只做个人理解笔记
最新发布
xu_duo_i的博客
04-25 296
vue+element 树形结构 改成懒加载模式(原理element有),这里只做个人理解笔记
vue3【详解】 vue3 比 vue2 快的原因
朝阳39的博客
04-19 940
vue3使用的 Proxy 在处理属性的读取和写入时，比vue2使用的defineProperty 有更好的性能（速度加倍的同时，内存还能减半！
vue编辑页面数据回显
04-21
很高兴能够回答你的问题。对于vue编辑页面数据回显，可以使用v-model来实现双向数据绑定，通过将模型数据和表单元素绑定在一起，实现数据的自动更新。此外，使用computed属性可以方便地对数据进行处理，从而更好地展示在页面上。另外，还可以使用watch来监听数据的变化，进行一些其他的操作。希望这些内容能够对您有所帮助。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 3
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

fruge365

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值