vue2 tinymce富文本插件

一、介绍

TinyMCE是一款易用、且功能强大的所见即所得的富文本编辑器。同类程序有:UEditorKindeditorSimditorCKEditorwangEditorSuneditorfroala等等。

TinyMCE的优势:

  • 开源可商用,基于LGPL2.1
  • 插件丰富,自带插件基本涵盖日常所需功能
  • 接口丰富,可扩展性强,有能力可以无限拓展功能
  • 界面好看,符合现代审美
  • 提供经典、内联、沉浸无干扰三种模式
  • 对标准支持优秀(自v5开始)
  • 多语言支持,官网可下载几十种语言。

中文官网:TinyMCE中文文档中文手册 (ax-z.cn)

官网及文档:www.tiny.cloud

官网下载:www.tiny.cloud/get-tiny/self-hosted/

Githubgithub.com/tinymce

【推荐】为vue开发者整合的tinymce组件

二、下载

项目是vue2,使用的tinymce版本是4.7.5,可点击【下载】源文件,然后解压到前端工程public文件夹下,如下图所示:

三、引入

在项目public文件夹中的index.html文件中引入tinymce,代码如下:

<script src="./tinymce4.7.5/tinymce.min.js"></script>

四、封装

封装好的组件可点击【下载】源文件引入到前端工程components目录下

五、使用

value就是传入富文本html字符串

<template><Tinymce v-model="value" />
</template><script>
import Tinymce from "@/components/Tinymce/index";export default {components: { Tinymce },data: {return {value: ''}}
}
</script>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/189077.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【网络安全】伪装IP网络攻击的识别方法

随着互联网的普及和数字化进程的加速&#xff0c;网络攻击事件屡见不鲜。其中&#xff0c;伪装IP的网络攻击是一种较为常见的攻击方式。为了保护网络安全&#xff0c;我们需要了解如何识别和防范这种攻击。 一、伪装IP网络攻击的概念 伪装IP网络攻击是指攻击者通过篡改、伪造I…

MIB 6.1810实验Xv6 and Unix utilities(5)find

难度:moderate Write a simple version of the UNIX find program for xv6: find all the files in a directory tree with a specific name. Your solution should be in the file user/find.c. 题目要求&#xff1a;实现find &#xff0c;即在某个路径中&#xff0c;找出某…

Ansible密码正确但无法登录目标服务器

问题 通过ansible-playbook批量管理服务器&#xff0c;需要事先编写inventory文件&#xff0c;目标服务器均使用随机密码。在使用ansible-playbook和ansible命令时&#xff0c;均出现其中一台无法登录成功的问题。通过ssh命令&#xff0c;使用inventory中记录得用户名、密码测…

腾讯云重新注册算不算新用户?算!

腾讯云重新注册算新用户&#xff0c;但有以下限制&#xff1a; 首先&#xff0c;实名认证信息不能沿用老账号的信息&#xff0c;必须使用新的信息进行认证。这是为了确保重新注册的账号能够被视为新用户&#xff0c;并享受到新用户的特权和优惠。 腾讯云双十一领9999代金券 h…

聚观早报 |联想集团Q2财季业绩;小鹏汽车Q3营收

【聚观365】11月17日消息 联想集团Q2财季业绩 小鹏汽车Q3营收 微软发布两款自研AI芯片 FAA批准SpaceX再次发射星际飞船 2023 OPPO开发者大会 联想集团Q2财季业绩 全球数字经济领导企业联想集团公布截至2023年9月30日的2023/24财年第二财季业绩&#xff1a;整体营收达到10…

安装应用与免安装应用差异对比

差异 安装的程序和免安装的应用程序之间有以下几个方面的差别&#xff1a; 安装过程&#xff1a;安装的程序需要通过一个安装程序或安装脚本进行安装。这个过程通常会将应用程序的文件和依赖项复制到指定的目录&#xff0c;并进行一些配置和注册操作。免安装的应用程序则不需要…

达芬奇DaVinci Resolve Studio 18.6.3 for Mac

DaVinci Resolve Studio 18是一款专业的视频编辑和调色软件&#xff0c;适用于电影、电视节目、广告等各种视觉媒体的制作。它具有完整的后期制作功能&#xff0c;包括剪辑、调色、特效、音频处理等。 以下是DaVinci Resolve Studio 18的主要特点&#xff1a; - 提供了全面的视…

【Git学习二】时光回溯:git reset和git checkout命令详解

&#x1f601; 作者简介&#xff1a;一名大四的学生&#xff0c;致力学习前端开发技术 ⭐️个人主页&#xff1a;夜宵饽饽的主页 ❔ 系列专栏&#xff1a;JavaScript小贴士Git等软件工具技术的使用 &#x1f450;学习格言&#xff1a;成功不是终点&#xff0c;失败也并非末日&a…

基于协作mimo系统的RM编译码误码率matlab仿真,对比硬判决译码和软判决译码

目录 1.算法运行效果图预览 2.算法运行软件版本 3.部分核心程序 4.算法理论概述 5.算法完整程序工程 1.算法运行效果图预览 2.算法运行软件版本 matlab2022a 3.部分核心程序 ..................................................................... while(Err < TL…

某app c++层3处魔改md5详解

hello everybody,本期是安卓逆向so层魔改md5教学,干货满满,可以细细品味,重点介绍的是so层魔改md5的处理. 常见的魔改md5有: 1:明文加密前处理 2:改初始化魔数 3:改k表中的值 4:改循环左移的次数 本期遇到的是124.且循环左移的次数是动态的,需要前面的加密结果处理生成 目录…

Day33力扣打卡

打卡记录 最大和查询&#xff08;排序单调栈上二分&#xff09; 链接 大佬的题解 class Solution:def maximumSumQueries(self, nums1: List[int], nums2: List[int], queries: List[List[int]]) -> List[int]:ans [-1] * len(queries)a sorted(((a, b) for a, b in zi…

AI监管规则:各国为科技监管开辟了不同的道路

AI监管规则&#xff1a;各国为科技监管开辟了不同的道路 一份关于中国、欧盟和美国如何控制AI的指南。 编译 李升伟 茅 矛 &#xff08;特趣生物科技有限公司&#xff0c;广东深圳&#xff09; 插图&#xff1a;《自然》尼克斯宾塞 今年5月&#xff0c;科技公司OpenAI首席…