美文网首页
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