微信小程序富文本样式超出问题

jojo是只猫

于 2024-07-09 15:53:12 发布

阅读量200

点赞数 1

文章标签：微信小程序小程序

本文链接：https://blog.youkuaiyun.com/weixin_42496938/article/details/140298323

版权

   <rich-text :nodes="formatRichText(content)" ></rich-text>

const formatRichText = (html) => {
  let newContent = html.replace(/<img[^>]*>/gi, function (match) {
    match = match.replace(/style="[^"]+"/gi, "").replace(/style='[^']+'/gi, "");
    match = match.replace(/width="[^"]+"/gi, "").replace(/width='[^']+'/gi, "");
    match = match.replace(/height="[^"]+"/gi, "").replace(/height='[^']+'/gi, "");
    return match;
  });
  newContent = newContent.replace(/style="[^"]+"/gi, function (match) {
    match = match
      .replace(/width:[^;]+;/gi, "max-width:100%;")
      .replace(/width:[^;]+;/gi, "max-width:100%;");
    return match;
  });
  newContent = newContent.replace(/<br[^>]*\/>/gi, "");
  newContent = newContent.replace(
    /\<img/gi,
    '<img style="max-width:100%;height:auto;display:block;margin-top:0;margin-bottom:0;"'
  );

  return newContent;
};