React|React Native之特定平台

React|React Native之特定平台
文章图片
在跨平台时,我们可能需要不同的平台编写不同代码的需求。

  • 不同平台返回不同的style
【React|React Native之特定平台】第一种方式:
var styles = StyleSheet.create({ height:Platform.OS === "ios" ? 200:100 })

Platform.OS在iOS上会返回ios,在Android设备上会返回android。
第二种方式:
var styles = StyleSheet.create({ container:{ flex: 1, ...Platform.select({ ios:{ backgroundColor:"red" }, android:{ backgroundColor: "blue" } }) } })

也可以利用Platform.selecte实现不同平台返回不同的组件。
constComponent = Platform.select({ ios:()=> require("ComponentIOS"), android:()=> require("ComponentAndroid") })

  • 检测Androdi版本
    也就是Android的api level。
if (Platform.Version() === 25) { console.log("Running on Nougat!") }

  • 检测iOS版本
var majorVersionIOS = parseInt(Platform.Version,10); if (majorVersionIOS <= 9) { console.log("Work around a change in behavior") }

    推荐阅读