Flutter Web移动端浏览器文本顺序反转问题排查求助

问题原因 #

• 移动端与桌面端浏览器的双向文本（BIDI）解析规则差异：在RTL布局下，手机号、日期、数字这类包含分隔符的中性文本，桌面浏览器默认保持原始顺序，而移动端浏览器的BIDI引擎会将这类文本视为可反转序列，导致显示顺序颠倒。
• Flutter版本升级后的文本渲染逻辑变更：新版本Flutter Web调整了RTL场景下的文本处理策略，不再强制锁定中性文本的显示顺序，转而依赖浏览器原生BIDI处理，放大了不同平台浏览器的行为差异。

解决办法 #

• 强制指定文本方向：针对手机号、日期、数字这类需要固定顺序的文本，直接在Text组件中设置方向，覆盖全局RTL设置：

  Text(
    value ?? '',
    textDirection: TextDirection.ltr,
  )
  

• 添加左至右标记（LRM）：在文本开头插入Unicode字符\u200E，强制文本按左到右顺序渲染，避免BIDI引擎反转：

  Text('\u200E${value ?? ''}')
  

• 排查Flutter版本变更：查看升级对应的Flutter版本发布文档，确认是否有双向文本渲染的相关配置项，调整以匹配原有行为。

内容的提问来源于stack exchange，提问作者Yaron Kadman