vue项目中使用富文本编辑器

前言: 有时候项目中会使用到一些富文本编辑器(所见即所得)。比如markdown那种功能的工具 。但是如果我们自己开发一个的话,就需要话很长的时间。

那么我们就可以使用开源的,其他人已经写好的第三方库。

比如常见的就是TinyMCE、CKEditor、UEditor、wangEditor、kindeditor等,还有很多。

这篇文章主要是讲解vue3项目中使用TinyMCE富文本编辑器。

GitHub地址:GitHub - tinymce/tinymce-vue: Official TinyMCE Vue component

第一步、安装依赖

npm install --save "@tinymce/tinymce-vue@^5"  // vue3项目
npm install --save "@tinymce/tinymce-vue@^3" // vue2项目

第二步:组件中使用富文本编辑器


自此,项目中就能使用富文本编辑器了。效果如下,是不是很简单呢。

vue项目中使用富文本编辑器_第1张图片

        

你可能感兴趣的:(vue.js,javascript,前端,编辑器)