1 export function handleHtmlImg(string) {
2   var richtext = string;
3   const regex = new RegExp("<img", "gi");
4   if (richtext != null) {
5     richtext = richtext.replace(regex, `<img style="max-width: 100%;"`);
6   }
7   return richtext
8 }

結果發現有些富文字內圖片自帶行內樣式於是得先清除富文字中自帶的樣式，再新增max-width:

export function
 
 handleHtmlImg(html) {
  // 先手動清除所有img自帶的樣式，再手動新增max-width
  let newContent = html.replace(/<img[^>]*>/gi, function (match, capture) {
    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, capture) {
    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%;"');
  return newContent;
}