React Native移动端如何设置不带px单位的lineHeight样式？

在Expo跨端场景下，React Native原生端与Web端对lineHeight的解析规则存在差异，可通过平台区分来解决这个矛盾：

• React Native原生端（Android/iOS）要求lineHeight为数字类型，代表字体大小的倍数
• Web端需要传入字符串格式的倍数值，避免被自动转换为px单位

直接利用Platform模块分别设置对应值即可：

import { StyleSheet, Platform } from 'react-native';

export default StyleSheet.create({
  placeholdersText: {
    lineHeight: Platform.OS === 'web' ? '1.6' : 1.6,
  },
});

或者使用更清晰的Platform.select语法：

import { StyleSheet, Platform } from 'react-native';

export default StyleSheet.create({
  placeholdersText: {
    ...Platform.select({
      web: { lineHeight: '1.6' },
      default: { lineHeight: 1.6 },
    }),
  },
});

这样设置后，Web端会以倍数形式渲染行高，原生端也不会触发类型错误。

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