同一篇富文本内容，在普通H5页面里图片可以正常显示，但是在微信小程序不显示

[lqyc]

使用环境

平台：微信小程序 基础库版本： 2.30.3 机型： 安卓和ios

问题描述

同一篇富文本内容，在普通H5页面里图片可以正常显示，但是在微信小程序不显示。

复现方式

富文本需要显示图片的地方外层自动加上了一层view, 样式里有display: inline-block;

• 场景一：当去掉外层view这个样式,图片可以有自己的 高度，图片正常显示。

  

• 场景二：没有去掉外层样式display: inline-block;图片高度为0，不显示。

  

引用插件

mp-html 版本： v2.4.0

      <mp-html wx:if="{{content}}" content="{{content}}" selectable="force" show-img-menu="{{true}}" />

[jin-yufeng]

提供可复现的 html 内容

[lqyc]

提供可复现的 html 内容

已提供，导出的一个常量文件，就是富文本内容。已测试该端富文本：

• 用微信富文本组件可以显示图片：

  <rich-text nodes="{{richNode}}"></rich-text> 

• 用mp-html 不显示图片：

  <mp-html  content="{{richNode}}" selectable="force" show-img-menu="{{true}}" />

  富文本内容word文档： 富文本内容.docx

[lqyc]

提供可复现的 html 内容

有结论了吗？富文本已提供

[whoooami]

目前测试了一下。因为微信小程序会额外加一层view， 如场景1图1所示。这时候这层view的高宽为0， 所以内部图片如果指定100%，则图片宽高也为0，所以不显示。

任选一个即可。 [推荐1]

1、如果去掉富文本style 中的width:100%!important; 正常显示
2、修改组件mp-html/node/node.vue style ._img

/* 图片默认效果 */
._img {
    min-width: 720rpx; //新增部分
  max-width: 100%;
  -webkit-touch-callout: none;
}

[lqyc]

目前测试了一下。因为微信小程序会额外加一层view， 如场景1图1所示。这时候这层view的高宽为0， 所以内部图片如果指定100%，则图片宽高也为0，所以不显示。

任选一个即可。 [推荐1]

1、如果去掉富文本style 中的width:100%!important; 正常显示 2、修改组件mp-html/node/node.vue style ._img

/* 图片默认效果 */
._img {
    min-width: 720rpx; //新增部分
  max-width: 100%;
  -webkit-touch-callout: none;
}

我们按您的指示修改组件mp-html/node/node.vue style ._img的图片默认效果样式，但是这个最小图片宽度会影响小图的展示。有些图片可能只有不到720rpx宽度。 如图所示:去掉最新宽带才显示正常，如图：

[lqyc]

我们按您的指示修改组件mp-html/node/node.vue style ._img的图片默认效果样式，但是这个最小图片宽度会影响小图的展示。有些图片可能只有不到720rpx宽度。 如图所示: 去掉最新宽带才显示正常，如图：

[whoooami]

的确，方式2的侵入性会比较强，所以方案1的方式在您那边展现是？此外还需要麻烦提供最新可复现的html