美文网首页
React Native之特定平台

React Native之特定平台

作者: 谢尔顿 | 来源:发表于2018-09-07 15:04 被阅读16次

在跨平台时,我们可能需要不同的平台编写不同代码的需求。

  • 不同平台返回不同的style

第一种方式:

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实现不同平台返回不同的组件。

const  Component = Platform.select({
    ios:()=> require("ComponentIOS"),
    android:()=> require("ComponentAndroid")
})
<Component/>
  • 检测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")
}

相关文章

网友评论

      本文标题:React Native之特定平台

      本文链接:https://www.haomeiwen.com/subject/adyxgftx.html