react-native字体超出省略号隐藏

字体超出省略号隐藏

ellipsizeMode

1. 这个属性通常和下面的 numberOfLines 属性配合使用，表示当 Text 组件无法全部显示需要显示的字符串时如何用省略号进行修饰
2. 该属性有如下 4 种取值:
   • head - 从文本内容头部截取显示省略号。例如： “…efg”
   • middle - 在文本内容中间截取显示省略号。例如： “ab…yz”
   • tail - 从文本内容尾部截取显示省略号。例如： “abcd…”
   • clip - 不显示省略号，直接从尾部截断。
3. numberOfLines number类型表示从第几行开始出现

   // 从第二行出现省略号
   <Text numberOfLines={2} ellipsizeMode="tail" style={[styles.desc, { color: theme.otherColor.text }]}>{item.name}</Text>
   
   

4. 如果想要View 下的子元素中的最后一个元素显示省略号，让最后一个元素设置flex:1 并且给Text 设置上方的属性