当前位置:   article > 正文

【uniapp】富文本_uni app富文本

uni app富文本

1、富文本显示,只显示文字,其余html不显示

功能:红框处其实是一个富文本,有图片之类的。但是现在不想根据html显示,只显示文字。

 直接上代码

  1. //内容显示
  2. <view>{{item.fhArticleVo.content}}</view>
  1. // 下拉刷新
  2. downCallback(page) {
  3. this.information()
  4. this.servicesPurchasedByUsers()
  5. this.fActivityList()
  6. this.api.invitation({
  7. pageNum: 1, //这个是upOption中的page传递的,upCallback的参数
  8. pageSize: page.size
  9. }).then(res => {
  10. res.rows.forEach(i => {
  11. i.fhArticleVo.content = this.delHtmlTag(i.fhArticleVo.content)
  12. })
  13. this.wordList = res.rows; //追加新数据
  14. this.mescroll.endBySize(res.rows.length, res.total); //隐藏加载状态
  15. }).catch(() => {
  16. //联网失败, 结束加载
  17. this.mescroll.endErr();
  18. })
  19. },
  20. // 删除html标签,只显示文字
  21. delHtmlTag(str) {
  22. return str.replace(/<\/?.+?>/g, "").replace(/&nbsp;/g, "").replace(/&lt;/g, "").replace(/&gt;/g, "");
  23. },

2、富文本mp-html的使用

我之前有试过其他富文本,但是效果都不太好,所以选择了这个。

在插件商城里导入文件,然后直接使用即可,不需要引入

<mp-html :content="content.fhArticleVo.content" />

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/我家小花儿/article/detail/974651
推荐阅读