需求：后台因为通过富文本编辑器编写内容，前台需要展示后台返回的内容，所以会有列表页和详情页，列表页要提取编辑文本中的部分内容作为标题，而详情则是展示所有编辑内容。

思路其实就是后台通过富文本编辑器编写内容之后然后保存，编辑器会将所有的内容转义成带有标签的内容，然后传给后端，后端再通过接口将整个标签的内容返给前台，

前台在通过v-html标签展示在详情页就行了，但是我们的列表页标题，却只是获取内容的中的一部分，且不能让标题的内容各式各样的，因为返回的是标签。V-html会将标签中的css样式也展示出来，所以这样是不行的，所以我们去掉css中的样式，最开始我想的思路就是重新都写一套css样式，但是后来发现用户通过编辑器输入内容的使用的格式是多变的，前端时无法把控的，比如会出现如下情况：

可以有看出该列表名称还出现了一张图片，所以这是行不通的，因此如果重写一套代码太过于繁琐了，

所以本人想到了另外一种方法，就是如何只获取标签中的文本内容，这个时候就想到了正则表达式，因为所有的标签都是以/>结尾以<开头，所以我们只需要去掉这两者之间和两者的内容即可，所以就有了如下代码，

 this.totalCount = res.data?.results?.page?.total;
        const rows = res.data.results.data;
        this.listData = this.listData.concat(rows);
        this.listData.forEach(item => {
          // 使用正则去去掉标签，只展示文本
          const reg = /<\/?.+?\/?>/g;
          item.content = item.content.replace(reg, '');
          item.issueTime = item.issueTime.slice(0, 10);
        });

，加了以上两行代码之后，效果如下：

这样就达到了产品所需要的效果了，

接下来再给大家看看该列表中的详情内容吧

好了以上呢就是本章内容，感谢各位