百度Ueditor开源的一款现代化界面的富文本编辑器!
目录
文章目录隐藏
Neditor 是基于 Ueditor 的一款现代化界面的富文本编辑器,在百度富文本框 UEditor 的基础上进行了美化并扩展,样式更加美观,功能更加强大,本文将带你体验一下。先放一张截图:
如何使用 Ueditor
第一步,下载编辑器
方式一:完整安装包(推荐)
推荐直接到对应码云仓库或者 Github 仓库下载
方式二:npm 安装
npm i @notadd/neditor -S
方式三:编译安装
git clone https://github.com/notadd/neditor.git npm install npm run build
第二步:在浏览器打开 index.html
无需服务端配置即可体验,进入到目录 dist
, 使用浏览器打开文件 index.html
。下面是我本地打开全屏的效果图,初步部署成功
技术支持
自定义的参数
编辑器有很多可自定义的参数项,在实例化的时候可以传入给编辑器:
var ue = UE.getEditor('container', { autoHeight: false });
配置项也可以通过 neditor.config.js
文件修改,具体的配置方法请看 [前端配置项说明]( 前端配置项说明.md)、后端配置项说明
编辑器图片、视频、涂鸦、附件上传 service
编辑器上传逻辑单独在 neditor.service.js
文件配置,具体的配置方法见注释
设置和读取编辑器的内容
通 getContent 和 setContent 方法可以设置和读取编辑器的内容
var ue = UE.getContent(); ue.ready(function(){ //设置编辑器的内容 ue.setContent('hello'); //获取 html 内容,返回: <p>hello</p> var html = ue.getContent(); //获取纯文本内容,返回: hello var txt = ue.getContentTxt(); });
Ueditor 的更多 API 请看 API 文档
项目地址
注:对 IE8 以下版本不再承诺兼容
结束语
百度的 UEditor 富文本编辑器很强大,但是奈何界面比不过现在很多编辑器,因此 NEditor 是一个非常值得尝试的选择,大家有能力的可以多支持支持开发者,可以选择一款适合自己项目的。
声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。
码云笔记 » 百度Ueditor开源的一款现代化界面的富文本编辑器!
码云笔记 » 百度Ueditor开源的一款现代化界面的富文本编辑器!