Skip to content

Tian-ya-luer/text-ellipsis

 
 

Repository files navigation

文本省略

SimpleEllipsis2.vue

实现思路:

  1. 确定需要显示的文本,在文本内容后添加省略符号即可;
  2. 构造一个看不见的div容器,高度为显示行数,尝试找到截取文本内容的位置,使得截取文本后添加省略符号刚好充满容器(多一个字就会换行的情况),该截取的文本即为需要显示的文本;
  3. 通过二分法确定截取位置即可;

预览

地址: https://xiaocheng555.github.io/text-ellipsis/

About

vue3多种文本省略实现

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors

Languages

  • Vue 95.7%
  • TypeScript 2.4%
  • HTML 1.3%
  • JavaScript 0.6%