v-html图片适配

v-html指令在Vue中用于渲染富文本，但是它无法直接设置图片的自适应大小。为了解决这个问题，可以使用CSS样式或添加监听事件来实现图片适配。以下是一些解决方案：

1. 使用CSS样式：可以通过为图片添加CSS样式来实现自适应大小。可以使用`max-width: 100%;`和`height: auto;`来确保图片在超出容器宽度时按比例缩放，并保持高度自适应。

img {
  max-width: 100%;
  height: auto;
}

2. 监听事件：在Vue组件中，可以使用`@load`事件监听图片加载完成后，再进行大小调整。可以在图片加载完成时，通过获取图片的宽度和高度，来动态计算并设置图片的样式。

<template>
  <div>
    <div v-html="richText" @load="adjustImageSize"></div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      richText: '<p>富文本内容</p><img src="图片地址" alt="图片描述">',
    };
  },
  methods: {
    adjustImageSize(event) {
      const img = event.target;
      img.style.maxWidth = '100%';
      img.style.height = 'auto';
    },
  },
};
</script>

以上是两种常见的解决方案，可以根据实际情况选择适合的方法进行图片适配。