react-native - react 导航 : Apply SafeAreaView globally with Redux

Question

我正在尝试以全局方式将 SafeAreaView 应用到我的应用程序，以避免将它单独插入到每个 View 中，但是当我这样做时， View 的顶部和底部会出现一个阴影，并且我意识到那是因为我应用了 index.js 中的 SafeAreaView 但是当我直接在每个 View 中执行时，它按预期工作，你知道为什么或者我做错了什么吗？

在 index.js 中使用 SafeAreaView

const styles = StyleSheet.create({
  safeArea: {
    flex: 1,
    backgroundColor: 'white',
    shadowColor: 'transparent',
  },
});

const AppContainer = () => (
  <Provider store={store}>
    <SafeAreaView style={styles.safeArea}>
      <StatusBar backgroundColor="#EEEEEE" barStyle="dark-content" />
      <AppWithNavigationState />
    </SafeAreaView>
  </Provider>
);

在特定 View 中使用 SafeAreaView

我试图移除那个阴影，但不可能。

Answer 1

您需要将 shadowColor: 'transparent' 添加到 stackNavigator 的 cardStyle 中，无论您在 routeConfig 中使用它

像这样

cardStyle: {
    shadowColor: 'transparent'
  }