uniapp-rich-text无法处理video问题

uni-app 中 rich-text 的支持并不包含 video

解决办法

播放 video 时使用的是uParse 富文本解析

1. 在项目中导入插件

2. 在页面中导入插件

   import uParse from '@/components/u-parse/u-parse.vue';
   

3. 替换rich-text

   <!-- <rich-text :nodes="content"></rich-text> -->
   <u-parse :content="content" />
   

### 默认的vedio样式需要修改时，可以使用正则表达式替换

1. 新建 js 文件 ： richTextUtil.js

   ```js
   /**
    * 处理富文本里的图片宽度自适应
    * 1.去掉img、video标签里的style、width、height属性
    * 2.修改所有style里的width属性为max-width:100%
    * 3.img、video标签添加style属性：max-width:100%;height:auto
    * 4.去掉<br/>标签
    * @param html
    * @return string
    */
   function formatRichText (html) {
   	// 去掉img标签里的style、width、height属性
   	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;
   	});
   	
   	// 去掉video标签里的style、width、height属性
   	newContent= html.replace(/<video[^>]*>/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;
   	});
   	// 修改所有style里的width属性为max-width:100%
   	// 去掉所有style里的font-size属性
   	newContent = newContent.replace(/style="[^"]+"/gi,function(match,capture){
   		match = match.replace(/width:[^;]+;/gi, 'max-width:100%;').replace(/width:[^;]+;/gi, 'max-width:100%;');
   		match = match.replace(/font-size:[^;]+;/gi, '');
   		return match;
   	});
   	// 去掉<br/>标签
   	newContent = newContent.replace(/<br[^>]*\/>/gi, '');
   	// img标签添加style属性：max-width:100%;height:auto
   	newContent = newContent.replace(/\<img/gi, '<img style="max-width:100%;height:auto;display:block;margin:0px auto;"');
   	// video标签添加style属性：max-width:100%;height:auto
   	newContent = newContent.replace(/\<video/gi, '<video style="max-width:100%;height:auto;display:block;margin:0px auto;"');
   	return newContent;
   }
   
   export default {
   	formatRichText,
   };

2. 引入js库

   import richTextUtil from '@/common/richTextUtil.js';
   

3. 调用方法

this.content = richTextUtil.formatRichText(res.content);