React Navigation TabNavigator 滑动已禁用：SwipeRow (NativeBase) 未正确呈现 [Android]答案

【问题标题】：React Navigation TabNavigator swipe disabled: SwipeRow (NativeBase) not rendering correctly [Android]React Navigation TabNavigator 滑动已禁用：SwipeRow (NativeBase) 未正确呈现 [Android]
【发布时间】：2018-02-15 16:11:46
【问题描述】：

我使用来自react-navigation 的 TabNavigator，并在一个 Tab 中有一个可滑动的组件（来自 NativeBase 的 SwipeRow 组件）。在该组件上向左或向右滑动时，它会显示上下文菜单，因此我通过在TabNavigator 中声明swipeEnabled: false 来禁用android 中选项卡的滑动能力（iOS 默认为false）。好吧，现在禁用了 TabSwiping，但是突然之间，上下文菜单不再正确呈现。在带有swipeEnabled: true 的Android 和iOS 上一切正常！

截图（卡片元素向左滑动）：

Android 与 swipeEnabled: false

iOS（正确）

代码：

    <SwipeRow
      leftOpenValue={100}
      rightOpenValue={-100}
      left={<View style={{flex: 1,
               flexDirection: 'column',
               justifyContent: 'space-between',
               marginTop: 7,
               marginBottom: 7,
               marginLeft: 3,
               marginRight: 3,}}>
                   <Button>...</Button>
                   <Button>...</Button>
             </View>}
      body={<Card > ... </Card>}
      right={/* similar to `left` */}
      style={{backgroundColor: 'transparent', 
              padding: 0,
              paddingRight:0,
              paddingLeft:0,
              paddingTop:0,
              paddingBottom:0, 
              margin: 0,
              marginTop: 0, 
              marginLeft: 0, 
              marginRight: 0,  
              marginBottom: 0, 
              borderBottomWidth:0,
              flex: 1,
            }}
     />

任何想法为什么会发生这种情况？我可以用另一种方式禁用 TabSwiping，还是可以以不同的方式设置菜单样式，以便在 Android 上使用 swipeEnabled: false 正确呈现？

【问题讨论】：

标签： android reactjs react-native react-navigation native-base

【解决方案1】：

我现在很确定这是一个样式问题。向 SwipeRow style-prop 添加一个固定高度可以解决问题，flex: 1（见上文）使上下文菜单在整个显示高度上展开。不过，我不知道内容的高度是多少。现在我试着计算得非常接近，但我对swipeEnabled: false 之前的解决方案更满意。禁用此选项对整个 NativeBase Content、Container 或 Tab 组件有什么影响？

【讨论】：