Vue3中怎样集成最强的tinymce富文本编辑器
haoteby 2024-12-19 13:13 6 浏览
什么是tinymce富文本编辑器
“世界上最先进的富文本编辑器”这是一句写在tinymce官网上的一句好，在实际体验中的确是这样，使用体验非常优秀。特别是tinymce的插件式开发方式，使其具备极高的自定义体验。
经过实际使用tinymce5.8.2是可以集成在vue3中，通过组件化的方式进行调用。
缺点
Tinymce是非常优秀的一个插件式富文本编辑器，你可以在正常的前端项目和vue等多种项目中进行集成使用，但是在vue3中使用tinymce富文本编辑器，不仅需要tinymce的支持，而且需要@tinymce/tinymce-vue的插件支持，所以无法进行cdn加速（目前我没有找到合适方法，有建议可以留言）所以体积比较大，仅打包后的js就1.2mb的大小。
加载中文语言
由于tinymce5.0以后的版本官方没有出简体中文包，仅说了一句可以使用4.0的中文包，但是4.0的中文包会在使用时存在翻译不准的情况，我对中文包内容进行了适当优化，你可以直接进行使用，中文包地址https://gitee.com/unitui/unituicli3.git，在unituicli3/ src / unitui / assets / tinymce文件夹内。
安装使用：
安装tinymce
npm install tinymce
安装tinymce-vue
npm install @tinymce/tinymce-vue
新建一个组件，写入如下内容。
源码地址：https://gitee.com/unitui/unituicli3/blob/master/src/unitui/sub/Uedit.vue
你可以在组件中进行引用注册即可，可以通过v-model进行双向绑定。
源码：https://gitee.com/unitui/unituicli3/blob/master/src/uviews/unit/Edit.vue
实际效果
开源实践项目
推荐gitee开源半月斩获17星的unitui快速vue3+elementPlus开发框架，此开源项目由我个人维护喜欢可以使用哦
结语
喜欢可以关注、点赞、转发哦。
相关推荐
- 单点登录(SSO)解决方案介绍（单点登录概念）
-
一、单点登录的介绍单点登录（SingleSignOn），简称为SSO，是目前比较流行的企业业务整合的解决方案之一。SSO的定义是在多个应用系统中，用户只需要登录一次就可以访问所有相互信任的应用系...
- 系统登录的三种方式，哪一种更安全?
-
登录是一个高频的动作，笔者抓住这一个小点，分析了系统登录的几种方式和对应的场景。今天谈谈登录。登录即用户输入用户名和密码登录进系统中。B端系统，对于登录的业务场景有两种（可能不止，目前遇到过这两种）：...
- 到底什么是单点登录(SSO)?（什么叫做单点登录）
-
什么是单点登录？单点登录（SingleSign-On，简称SSO）是一种集中式的身份验证和授权机制，用户只需在一处输入一次凭证（例如用户名和密码）就可以访问多个相关但独立的软件系统。在数字化时代，...
- 5年稳如老狗的单点登录系统，到底是怎么搞出来的?
-
说到单点登录（SingleSign-On，简称SSO），大家的第一反应可能是——啊不就是登录一次，能到处串门儿嘛？别说，还真差不多，就是这么个意思。但真要搭一套好用、耐造、还能扛住公司里各种奇奇怪...
- 这些负载均衡都解决哪些问题?服务、网关、NGINX?
-
在微服务项目中，有服务的负载均衡、网关的负载均衡、Nginx的负载均衡，这几个负载均衡分别用来解决什么问题呢？一、服务的负载均衡先抛出一个问题：...
- Nginx负载均衡最全详解(4大算法原理机制)
-
Nginx在大型网站架构很重要，也是大厂重点考察方向，今天我就重点来详解Nginx负载均衡@mikechen本篇已收于mikechen原创超30万字《阿里架构师进阶专题合集》里面。Nginx负载均衡N...
- 负载均衡 Nginx Session 一致性（nginx 负载均衡 会话保持）
-
HTTPS请求跳转...
- 监控Oracle Cloud负载均衡器:Applications Manager释放最佳性能
-
设想你正在运营一个受欢迎的在线学习平台，在考试前的高峰期，平台流量激增。全球的学生同时登录，观看视频、提交作业和参加测试。如果OracleCloud负载均衡器不能高效地分配流量，或者后端服务器难...
- Nginx负载均衡:nginx.conf配置文件说明!
-
大家好，欢迎来到程序视点！我是你们的老朋友.小二！在此记录下Nginx服务器nginx.conf负载均衡的配置文件说明,部分注释收集与网络.关于nginx.conf基本的配置，请查看上一篇文章！Ng...
- Java高可用系统架构中的负载均衡策略
-
Java高可用系统架构中的负载均衡策略在现代的分布式系统中，负载均衡策略是构建高可用系统的基石。Java开发者需要深刻理解这些策略，以便打造稳定且高效的系统。接下来，让我们一起揭开负载均衡的神秘面纱。...
- Spring Boot3 客户端负载均衡全解析:从原理到实战
-
在当今互联网大厂后端技术开发的激烈竞争环境中，构建高效、稳定的微服务架构是核心诉求。其中，SpringBoot3作为热门开发框架，其客户端负载均衡功能对于提升系统性能、保障服务稳定性起着关键作用。...
- MySql高可用集群MySQL Router负载均衡读写分离
-
名词解释MGR:MysqlGroupReplication组复制，多台MySQL服务器在同一组中会自动保持同步状态，当某台服务器故障时，整个复制组依然可以保持正常并对外提供服务。...
- 性能测试之tomcat+nginx负载均衡（nginx tomcat）
-
nginxtomcat配置准备工作：两个tomcat执行命令cp-rapache-tomcat-8.5.56apache-tomcat-8.5.56_2修改被复制的tomcat2下con...
- win10/11双网卡链路聚合叠加负载均衡提升网速解决网卡网速瓶颈!
-
双网卡链路聚合一种网络配置技术，通过将多个物理网卡绑定在一起，形成一个逻辑上的网络接口，以提高网络的可靠性、可用性和性能。这种技术通常用于服务器和网络设备中，以实现负载均衡、冗余和高可用性。本机环境：...