在红米10上,Text 包裹的文字,和其他机型不一样,会出现异常换行,有时候即使宽度还有富余,但也会换行。

调试之后发现很莫名其妙,明明还有空间但换行了。查资料后发现也有人遇到同样的问题。
- Android 上存在吞字现象,现象是部分机型上最后一个字符不显示,原因不明。目前的折衷方案是文字的最后一行多加一个空格 or 零宽字符,或者直接强制修改字体 family
我采用了在文字后面追加零宽字符的方式解决。添加空格也可以,但空格有长度。
const FormatText: React.FC<IProps> = function ({ children, size = 'normal', color = 'default', style, spacer, ...props }) { const spacerText = Platform.OS === 'android' ? '\u200B\u200B' : ''; return ( <Text style={[styles.row, styles?.[size], styles?.[color], style]} {...props}> {children} {spacer && spacerText} </Text> ); };
可以参考下这篇文章:https://supercodepower.com/react-native-tweet#2text
但零宽字符也不是万能的,不同文本可能需要不同数量的零宽字符,目前只能靠试。