时间: 2020-08-23|61次围观|0 条评论

业务场景:

项目是一个商品类型,现在商品介绍管理端是用的富文本做的内容发布和编辑;小程序对接的时候,能否支持这样的场景,比如react里面有单独的标签来接收html,希望解决问题:能够加入一个支持html解析的组件,最起码能够保持格式不变和能够展示图片!

改问题请参考下面链接地址:
[链接地址]
(https://developers.weixin.qq.com/blogdetail?action=get_post_info&docid=000ec6762741f8e278f61ba8951000&token=1802039541&lang=zh_CN)

解决思路:
使用:
<rich-text>组件了解一下
https://developers.weixin.qq.com/miniprogram/dev/component/rich-text.html

当然有一个小问题(重点说明):图片无法自适应,需要自己解决这个问题
提供两种方案解决:
方案一:
替换成比较通用的百分比模式
参考链接地址:https://blog.csdn.net/qq_31843517/article/details/80446894

wxml文件下  <view class="find-content">    <rich-text nodes="{{weeklyDetail.content}}" type='text'></rich-text></view>js文件下 f1.getWeeklyById(id, res => {     let content = res.content;     //重点是这句话 res.content是从后台获取的数据 进行正则匹配的     res.content = content.replace(/\<img/gi, '<img style="width:100%;height:auto" ')     this.setData({     weeklyDetail: res})

方案二:
替换成比较常规的固定大小

.replace( '<img' , '<img style="max-width: 320px;" width="320px"' ) 

自己的代码展示:

小程序 支持html富文本吗插图
1111111.png

文章转载于:https://www.jianshu.com/p/9b9b97b17393

原著是一个有趣的人,若有侵权,请通知删除

本博客所有文章如无特别注明均为原创。
复制或转载请以超链接形式注明转自起风了,原文地址《小程序 支持html富文本吗
   

还没有人抢沙发呢~