富文本数据只展示文字，前端必知 |
您所在的位置：网站首页 › 文字内容过滤怎么设置 › 富文本数据只展示文字，前端必知 |
富文本数据只展示文字，前端必知
|
先看原始效果，我这里是用了v-html展示内容，如果是v-text则会直接显示源码（请看下面的代码）。 新的一年已经到来，让我们撸起袖子，加油干吧! 但是这样并不是前端需要的，原因我也说过了，相信每个前端人都能懂。我需要的是下面的： // 前端自己整好的同时也加上了字数限制，大于多少显示省略号... 各位同事们新的一年已经到来，让我们撸起袖...好了，代码放上（有什么不懂的欢迎留言，如果您只是一个对象可以查阅vue的计算属性。我这里是数组）。 template代码： {{contentHtml(item_Messages.content,index)}}js代码 data() { return { list_Messages: [], } }, methods: { contentHtml(content, index) { // 富文本编辑器的内容如何只获得文字去掉标签 content = content.replace(/]+>/g, ""); // 在上面的基础上还去掉了换行 // content = content.replace(/]+>/g, "").replace(/(\n)/g, ""); // 请注意，我这个是自定义全局方法，用于超过字数显示省略号的... // 之前文章有写过，下面也放上了链接，自行查看 return this.list_Messages[index].content = this.getEllipsis(content) }, },最终效果： 所以，各位赶紧给我点赞收藏关注三连吧！ |
但是这样就会出现一个问题，内容样式很突兀（主要为字体）。因此我就想要，富文本数据源码格式只展示文字。
如果你们也想要：内容超出我要显示省略号（…）两种方式你看着用！ 对了此处还用到了（133天前）：js根据时间进行判断究竟是多少天前？多少分钟前？小于一分钟就为刚刚？时间戳也可，字符串也可【本文地址】
今日新闻 |
推荐新闻 |