HTML代码

<rich-text :nodes="repairRichText(details.description)"></rich-text>

Vue2方法

// 优化富文本框中的img样式
		repairRichText(html){
		  // 去掉<img>中style /width / height属性
		  let newContent = html.replace(/<img[^>]*>/gi, (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, '')
		    match = match.replace(/style\s*=\s*(["'])(?:(?!\1).)*\1/gi, '') // 去除 style=""这样的属性
		    return match
		  })
		  // img标签添加style属性：max-width:100%;height:auto
		  newContent = newContent.replace(/\<img/gi,
		    '<img style="max-width:100%;height:auto;display:block;margin-top:0;margin-bottom:0;"'
		  )
		  return newContent;
		}