Vue filter过滤器使用

当我们渲染列表时发现账号字符长度过长所占宽度很宽影响页面美观,此时产品提出需求当账号长度大于20时取头部前六位,尾部后四位,中间使用xxxx连接,这时我们可以使用filter过滤器轻松达到目的。

首先我们循环接口列表数据,给div赋值

我们在组件components下可以开始写我们的过滤器filter,因为是通过接口字段进行动态拼接,所以这时候我们用到了ES6的模板字符串

如下图所示

最后在对应的div上进行赋值

这样就大功告成了


©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容