关于富文本编辑器

在使用了众多富文本编辑器后,终于有一些总结经验了.

这两天换了不下5个富文本编辑器,最后还是选择了第一次用的.后面的都白试了.

先说一下这个项目的需要,1.基本的字体以及样式修改要的,要图片上传功能,需要上传到自己公司的服务器,在获取地址后加上编辑中去,2.需要placeholder属性.

也许很多人都觉得这两个属性的富文本编辑器很多,然而在我花了1天左右时间寻找后,只有1款勉强满足自己的需要,placeholder这个属性还是自己通过修改原插件才得以实现的.

下面是我使用过的富文本编辑器:

1.react-mde https://github.com/andrerpena/react-mde.

这是一个非常简单的编辑器,但是不能上传图片,上传图片需要自己加网址.有placeholder属性.

2.wangEditor https://github.com/wangfupeng1988/wangEditor.

最终我选择了这一款的富文本编辑器,这款编辑器除了placeholder之外,图片上传的功能完全满足需要,placeholder只能通过自己的js能力来满足,可能还有一些些不足,不过基本上的原生的placeholder没有差别了.

3.react-quill  https://github.com/zenoamaro/react-quill

这是国外老哥写的编辑器,看了国外的老哥的东西,真的佩服,国外的码友都会互帮互助,这一点国内鲜有做到的,这款编辑器不能满足我是因为,编辑器把图片转成base64了,虽然能正常显示图片,可是后端需要接收的参数就多多了,这就有一些为难了,只能放弃.

4.braft-editor https://github.com/margox/braft-editor 

这款是基于draftjs封装的,挺好的富文本编辑器,placeholder有了,图片也能正常上传到自己的服务器,可是上传的图片不支持bmp,不清楚在哪里修改,又放弃了.再就是它的兼容性,需要ie11+

附上draftjs:https://github.com/facebook/draft-js,这个有1w多的star,国外朋友开发的.

5.react-draft-wysiwyg :https://github.com/jpuri/react-draft-wysiwyg

这款的文档表示看不明白,虽然引用成功了,但是不知道怎么设置api,不清楚怎么设置upload之类的.

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏BestSDK

苹果更新Xcode 9应用:新增全系统SDK,可在App Store免费下载

最近、除了新的 iOS 11、watchOS 4 和 tvOS 11 系统更新之外,苹果还发布了 Xcode 9 应用的最新版本,这款应用可以让开发者为 Mac...

32870
来自专栏葡萄城控件技术团队

ActiveReports 报表应用教程 (1)---Hello ActiveReports

在开始专题内容之前,我们还是了解一下 葡萄城ActiveReports报表 是一款什么产品:葡萄城ActiveReports报表是一款在全球范围内应用非常广泛的...

38160
来自专栏腾讯防水墙

验证码前端性能分析及优化实践

在越来越注重用户体验的趋势下,验证码作为一种自打诞生以来就被贴上“多余”标签的产品,更应该给用户提供良好的体验。本文以滑动验证码作为切入点,分析了验证码可能存在...

1.4K90
来自专栏娱乐心理测试

vue开发类似淘宝商品评价页面(星级,上传多张图片)

最近在写一个关于vue的商城项目,然后集成在移动端中,开发需求中有一界面,类似淘宝商城评价界面!实现效果图如下所示:

18920
来自专栏javascript趣味编程

2.2.6 第三方js类库

13900
来自专栏QQ会员技术团队的专栏

【开源公告】VasSonic轻量级的高性能的Hybrid框架正式开源

VasSonic取名于索尼动画形象音速小子,是腾讯QQ会员 VAS团队研发的一个轻量级的高性能的Hybrid框架,专注于提升页面首屏加载速度,完美支持静态直出页...

23960
来自专栏hbbliyong

Web 开发常备工具

工欲善其事,必先利其器。如今 Web 开发标准越来越高,Web 开发者也在不断寻找途径提升自己的技能。为使大家的开发工作更顺利进行,本文整理了 10+ 款比较优...

45980
来自专栏SEO

页脚、内容和导航中的链接如何影响SEO?

300110
来自专栏静晴轩

Html<a>标签href的困惑记载

近日,在工作中遇到一个小问题(给手游平台做些网页活动,其中牵涉到一个按钮链接,就习以为常的用了<a>标签,Click响应之后走一段js代码逻辑-弹出一个分享微信...

48850
来自专栏编程微刊

微信小程序从零开始开发步骤(八)引入框架WeUI

48940

扫码关注云+社区

领取腾讯云代金券