React原生导航新手：showInAppNotification上的全屏宽度？

Question

我使用react-native-navigation通过＆＃39; showInAppNotification＆＃39;来显示错误通知下拉菜单。

我尝试使用以下方式设置下拉框的样式：

{
  backgroundColor: colorRed,
  flex: 1,
  alignSelf: 'stretch',
}

我无法接受该flex来电。它保持为通知内文本的宽度。

也就是说，我得到的是：

我想要的是这个：

（第二个是通过设置999的硬宽度来实现的，但这不是一个令人满意的解决方案）

因此，根据我对React Native的样式表逻辑的有限理解，我假设我有一个父元素，其宽度高于通知。除了我没有。它被直接调用（好吧，除非我错过了某种注入的showInAppNotification组件）到我的Provider HOC中，它看起来像这样：

<Provider store={store}>
  <ErrorBoundary>
    {children}
  </ErrorBoundary>
</Provider>

要确认ErrorBoundary是全屏宽度，我在错误边界上抛出backgroundColor: green。它以预期的宽度返回，如下所示：

有关可能发生的事情的任何想法？如上所述，我是一个新的反应本地和＆amp;我可能错过了关于弹性逻辑的一些明显的东西，但我怀疑它是一个反应本机导航器通知问题，我希望其他人遇到过。任何想法都赞赏。

Answer 1

您可以导入将原生的尺寸类反应到组件中，并使用它来设置宽度，而不是为宽度提供硬编码值。

所以，你的代码看起来像这样：

import { ...., Dimensions } from 'react-native';

const { width } = Dimensions.get('window');

const styles = {
    notification : {
        backgroundColor: colorRed,
        width,
        alignSelf: 'stretch'
    }
}