详解Vue基于vue-quill-editor富文本编辑器使用心得

2024-06-24 11:12:15阅读量：32 字体：大 中 小

vue-quill-editor的guthub地址 ，现在市面上有很多的富文本编辑器，我个人还是非常推荐Vue自己家的vue-quill-deitor，虽然说只支持IE10+,但这种问题，帅给别人吧!

那么我们直击正题，在vue中使用quill呢，我们需要npm进行安装，安装命令如下：

详解Vue基于vue-quill-editor富文本编辑器使用心得

再安装依赖项

使用:

在main.js中进行引入

下面的css一定还要引用，否则编辑器将会没有css。

在vue页面中代码如下：

其中的v-model就是我们自己的html代码，你可以将这个html直接放到数据库，这样也就没有什么问题了。如果想要禁用编辑器可以通过以下代码：

主题设置

在vue项目中，具体引入Quill的文件中，需要使用哪种主题就写哪个。默认是snow主题的。

工具栏设置

图片推拽上传

需要安装 quill-image-drop-module 模块，那么改一下imageDrop设置为true，你就可以把你电脑上的图片网上一坨就可以了。

那上传文件那你就不用想了，你也许想先把图片放上去，其实这个文件托上去就已经是个base64了，等你在前台读数的时候直接decode就好~

图片调整大小ImageResize


免责声明：

本文《详解Vue基于vue-quill-editor富文本编辑器使用心得》版权归原作者所有,内容不代表本站立场！

如本文内容影响到您的合法权益（含文章中内容、图片等），请及时联系本站，我们会及时删除处理。

推荐阅读

  • 朋友圈设置三天可见是对所有人吗

    朋友圈设置三天可见是对所有人吗

    朋友圈三天可见是针对朋友圈的一个设置，针对所有的朋友，朋友圈设置三天可见后，所有朋友只能看到你最近三天的朋友圈。朋友圈设置三天可见的具体操作如下： 朋友圈设置三天可见是对所有人吗 1、打开手机微信ap...

    阅读: 731

  • 微信很小的那种表情包怎么做的

    微信很小的那种表情包怎么做的

    平常生活中微信很小的那种表情包可以在微信的小程序里根据自己的喜好进行制作，通过以下步骤制作微信表情包： 微信很小的那种表情包怎么做的 1、打开微信，切换到发现页面，点击小程序”进入小程序页...

    阅读: 1365

  • 剪映怎么在中间插视频

    剪映怎么在中间插视频

    想要使用剪映视频中间插入另一个视频，可以把原本视频分割再插入新的视频，通过以下步骤使用剪映在中间插视频： 剪映怎么在中间插视频 1、打开剪映，点击开始创作”进入选择页面。 2、选择一个视...

    阅读: 754

  • qq进群特效怎么关闭

    qq进群特效怎么关闭

    想要关闭qq进群特效，可以在qq群的进群特效相关功能进行关闭，开通超级会员才能享受进群特效，通过以下步骤关闭qq进群特效： qq进群特效怎么关闭 1、打开qq，点击qq群”进入qq群聊天页...

    阅读: 700

  • 地摊怎么申请微信商家码

    地摊怎么申请微信商家码

    地摊想要申请微信商家收款二维码，可以从微信收款小账本进行相关设置即可申请微信商家收款二维码，通过以下步骤可以申请微信商家收款二维码： 地摊怎么申请微信商家码 1、打开微信，切换到发现页面，点击小程序&...

    阅读: 800

  • 微信拉黑和删除

    微信拉黑和删除

    微信加入黑名单后给对方发消息，对方可以看到但不能回复，微信删除后双方都不能发消息，微信拉黑和删除具体步骤如下： 微信拉黑和删除 1、打开微信，切换到通讯录页面，点击联系人”进入联系人名片...

    阅读: 729

热门文章

最近更新