React-Text-Truncate

React-Text-Truncate

多行文字的省略(ellipsis),是目前設計的主流,但是除了 webkit 之外的瀏覽器,都要用一些 hack 的方式才可以達到,且大多情況下效果都不太好,借助React 的特性,可以輕鬆地達到這個目的,且跨瀏覽器(IE9+),更保持著良好的彈性!

目前的設計提供了

1
2
3
4
line (int): 要顯示的行數
truncateText (string): ellipsis的文字
text (string): 要顯示的文字
showTitle (bool): hover時顯示原始文字

安裝方式

1
2
npm i react-text-truncate (for React 0.14)
npm i [email protected] (for React 0.13.3 and below)

GitHub
Demo