国产开源富文本 开箱即用

wangEditor一个简练易用,功用强大的富文本修改器,它支持在多结构中运用,快速接入,装备简略,几行代码即可生成。

官方地址

www.wangeditor.com

github:

github.com/wangeditor-…

官网贴心肠为咱们预备了教学视频以及详细的多种结构运用教程。

该项目在GitHub开源后也收成了16k stars。

国产开源富文本 开箱即用

不过在前一段时间开始,wangEditor 就现已暂停了保护。当然咱们仍是能够继续运用,只是后边不会再有新功用和对项目进行优化了,不过就现在现有的功用也简直能满足了大部分项目的运用需求。

项目运用

来到一个vue3项目,尝试运用wangEditor修改器。运用之前需求装置两个相关的插件:

国产开源富文本 开箱即用

经过已装置的wangEditor/editor-for-vue插件,导入它的Editor,Toolbar组件,以及css样式文件:

国产开源富文本 开箱即用

这里运用的是官方模板,所以代码量会十分的少。

国产开源富文本 开箱即用

值得注意的是,vue3中修改器实例必须用shallowRef:

国产开源富文本 开箱即用

虽然只有这点代码量,但是简直实现了咱们平时运用干流修改器的一半功用。

国产开源富文本 开箱即用

兼容性

兼容干流的 PC 浏览器,如 Chrome Firefox Safari Edge 等

暂不支持移动端修改(支持移动端检查)

不再支持 IE 浏览器