富文本数据只展示文字，前端必知

先看原始效果，我这里是用了v-html展示内容，如果是v-text则会直接显示源码（请看下面的代码）。

但是这样就会出现一个问题，内容样式很突兀（主要为字体）。因此我就想要，富文本数据源码格式只展示文字。

// 后端传给前端的内容
<h2>各位同事们</h2><p>新的一年已经到来，让我们撸起袖子，加油干吧!</p>

但是这样并不是前端需要的，原因我也说过了，相信每个前端人都能懂。我需要的是下面的：

// 前端自己整好的同时也加上了字数限制，大于多少显示省略号...
各位同事们新的一年已经到来，让我们撸起袖...

好了，代码放上（有什么不懂的欢迎留言，如果您只是一个对象可以查阅vue的计算属性。我这里是数组）。

template代码：

<view v-for="(item_Messages, index) in list_Messages" :key="index">
	<text class="smallTitle"> 
		{
   
   {contentHtml(item_Messages.content,index)}}
	</text>
</view>

js代码

data() {
	return {
		list_Messages: [],
	}
},
methods: {
	contentHtml(content, index) {
		// 富文本编辑器的内容如何只获得文字去掉标签
		content = content.replace(/<[^>]+>/g, "");
		// 在上面的基础上还去掉了换行<br/>
		// content = content.replace(/<[^>]+>/g, "").replace(/(\n)/g, "");
		// 请注意，我这个是自定义全局方法，用于超过字数显示省略号的...
		// 之前文章有写过，下面也放上了链接，自行查看
		return this.list_Messages[index].content = this.getEllipsis(content)
	},
},

最终效果：

如果你们也想要：内容超出我要显示省略号（…）两种方式你看着用！
对了此处还用到了（133天前）：js根据时间进行判断究竟是多少天前？多少分钟前？小于一分钟就为刚刚？时间戳也可，字符串也可

所以，各位赶紧给我点赞收藏关注三连吧！