uni-app项目实战笔记26--uniapp实现富文本展示
方法一:使用uniapp官方插件:
<rich-text :nodes="noticeInfo.content"></rich-text>
:nodes传后台相应属性的值
缺点:不能实现图片点击预览,格式有限。
更多信息详见官方文档:rich-text | uni-app官网
方法二:使用uniapprtDCloud 插件市场其他组件,这里推荐mp-html:mp-html 富文本组件【全端支持,支持编辑、latex等扩展】 - DCloud 插件市场
这个插件平台兼容性,更新日期较近,说明开发团队在维护。
用法:
<mp-html :content="noticeInfo.content" />
:content传后台相应属性的值。
方法三:v-html
用法:
<view v-html="noticeInfo.content"></view>
v-html
可以 实现基础的富文本展示,但存在 安全性、样式兼容性和功能限制,不推荐。