我必须制作单独的 MyComponent.android.js 文件才能使用 SafeArea

Question

我对 react-native 还很陌生。每当我必须使用 SafeAreaView 时，我必须为同一组件创建一个单独的 .android.js 文件，而没有安全区域导致重复。

是否可以有条件地使用 SafeAreaView 和 platform.os？

Answer 1

SafeAreaView 仅支持 ios。因此，您可以针对特定的 os.

使用条件语句。

Answer 2

是的，可以有条件地将 SafeAreaView 用于 Platform.OS。 SafeAreaView 仅适用于 ios，但也适用于 android。在我的代码 SafeAreaView 上，两者都可以工作 OS。如果仅在特定的 OS 上有需求，请给出条件。

Answer 3

我有同样的问题。所以我所做的是创建一个名为任何你想要的组件，例如。 SafeScrollView.js 然后在该组件中有条件地渲染 SafeAreaView 然后将子组件传递给该组件。

例如：

我有 SafeScrollView.js 如下所示：

import React from 'react';
import { View, SafeAreaView, Platform } from 'react-native';

const SafeScrollView = (props) => {
    if (Platform.OS === "ios") {
        return (
            <View style={props.style}>
                {props.children}
            </View>
        );
    }
    return (
        <SafeAreaView style={props.style}>
            {props.children}
        </SafeAreaView>
    )
}

export default SafeScrollView

然后使用 SafeScrollView 作为组件，如下所示：

<SafeScrollView>
     // Your component
</SafeScrollView>

现在，在 IOS 中，它将呈现正常的 View 组件，如果设备是 android，它将呈现 SafeScrollView。因此，您不必创建单独的文件。

我必须制作单独的 MyComponent.android.js 文件才能使用 SafeArea

Do i have to make seperate MyComponent.android.js file to use SafeArea

react-native

safeareaview