Vue - 解决 v-html 指令（或其他解析插件）富文本解析图片无法自适应宽高问题（图片超出屏幕宽度且不受控）

前言

本文将提供一个函数，帮助您解决图片无法适应的问题，另外函数中还提供了一些常见的样式处理。

使用 v-html 指令或第三方插件解析富文本时，当内容包含图片时显示的结果就会超出父容器宽度，

会导致出现横向滚动条与图片变形，如下图所示对比情况。

解决方案

由于您无法通过直接指定 <img> 标签样式来试图设置为自适应图片，所以要另谋解决方案。

您可以直接复制以下封装好的 “健壮” 函数，并按照调用方法进行操作，融入您的项目中。

<div v-html="repairRichText('<b>您的富文本内容</b>'