v-html中的图片消失术！

在table列表中，数据若包含有图片与文字的htnl 进行截取操作，去除图片

原图是这样的：

but太丑丑丑丑了！！！！ 因为数据中包含标签、图片、文字信息，这个时候需要用到正则匹配了

首先找一个正则的片段

/<(\w+)[^>]*>(.*?<\/\1>)?/，这个是匹配W的

然后自己修改一下

/<(img+)[^>]*>(.*?<\/\1>)?/;

因为是从数组中拿的值，所以需要遍历该数组

let reg = /<(img+)[^>]*>(.*?<\/\1>)?/;
this.proDynamicList.forEach((el) => {
          let str = el.gdpm04.match(reg);
        });

这时拿到了正则匹配到的数据

然后，拿匹配到的img去替换，让数据中只显示文字：el.str = el.gdpm04.replace(str[0], "")

这里我用了三元表达式，判断每个数据中是否包含图片，有图片就替换，没有图片就等于原来的数据

let reg = /<(img+)[^>]*>(.*?<\/\1>)?/;
        this.proDynamicList.forEach((el) => {
          let str = el.gdpm04.match(reg);
          str != null
            ? (el.str = el.gdpm04.replace(str[0], ""))
            : (el.str = el.gdpm04);
          // debugger;
        });

解决展示：

方法2：补充 把我的总结发平台后，跳跳大佬跟我说了一个很简单的方法，只需要一行css，是的css

把这个class样式放到我需要的v-html的标签中，它就不会显示img.

.no-img-table img {
    display: none;
}

效果跟正则一样，且还简单。