Taro富文本标签图片解析失败问题

从0到零

已于 2024-08-14 09:43:32 修改

阅读量147

点赞数 1

文章标签： taro 前端

于 2024-08-13 21:15:04 首次发布

本文链接：https://blog.csdn.net/HX973661758/article/details/141174011

版权

    // 处理富文本图片
    replaceSpecialChar = (content:any) => {
      content = content.replace(/class=""/gi, '');
      content = content.replace(/class=''/gi, '');
      content = content.replace(/<p><\/p>/gi, '');
      content = content.replace(/<p> <\/p>/gi, '');
      content = content.replace(/<p> {2}<\/p>/gi, '');
      content = content.replace(/<p> {2}<\/p>/gi, '');
      content = content.replace(/&quot;/g, '"');
      content = content.replace(/&amp;/g, '&');
      content = content.replace(/&lt;/g, '<');
      content = content.replace(/&gt;/g, '>');
      content = content.replace(/&nbsp;/g, ' ');
      content = content.replace(/<div/gi, '<div class="rich_text_div_class" ');
      content = content.replace(/<p/gi, '<p class="rich_text_p_class" ');
      content = content.replace(
        /<table/gi,
        '<table class="rich_text_table_class" '
      );
      content = content.replace(/<span/gi, '<span class="rich_text_span_class" ');
      content = content.replace(/<ul/gi, '<ul style="max-width:100%" ');
      content = content.replace(
        /<img/gi,
        '<img class="rich_text_img_class" style="max-width:100%;display: block;" '
      );
      return content;
    };


//使用富文本
<RichText nodes={richTextContent} />

我们平时会遇到taro的图片属性不符合预期的情况，此时可以解析我们的入参，进行自定义属性，解决富文本图片解析的问题