6.4.3 editor 富文本编辑器-常用组件- 常用语法【uni-app教程uniapp教程(黄菊华-跨平台开发系列教程)】
6.4.3 editor 富文本编辑器
富文本编辑器,可以对图片、文字格式进行编辑和混排。
编辑器导出内容支持带标签的 html和纯文本的 text,编辑器内部采用 delta 格式进行存储。
通过setContents接口设置内容时,解析插入的 html 可能会由于一些非法标签导致解析错误,建议开发者在应用内使用时通过 delta 进行插入。
富文本组件内部引入了一些基本的样式使得内容可以正确的展示,开发时可以进行覆盖。需要注意的是,在其它组件或环境中使用富文本组件导出的html时,需要额外引入这段样式,并维护的结构,参考:使用 editor 组件导出的 html。
图片控件仅初始化时设置有效。
editor组件目前只有H5、App的vue页面和微信支持,其他端的富文本编辑解决方案,可使用web-view加载web页面,也可搜索插件市场 获取简单的markdown富文本编辑器
注意事项
- 插入的 html 中事件绑定会被移除
- formats 中的 color 属性会统一以 hex 格式返回
- 粘贴时仅纯文本内容会被拷贝进编辑器
- 插入 html 到编辑器内时,编辑器会删除一些不必要的标签,以保证内容的统一。例如
xxx
会改写为xxx
- 编辑器聚焦时页面会被上推,系统行为以保证编辑区可见
【uniapp参考资料】
(1)uni-app跨平台开发 入门到实战
https://ke.qq.com/course/package/26512
(2)uni-app 完整商城界面设计实战
https://ke.qq.com/course/2381059
(3)基于vue的uniapp商城完整项目源代码
https://ke.qq.com/course/3064977
(4)小白教程资料 http://www.2d5.net
(5)毕业设计网http://www.pc-365.net
(6)小程序编程网www.4317.org
(7)计算机编程网http://www.05423.com/