React native 反应本机基础-网格之间的空间？

我有一个网格，其中有一行和一列。我复制了这一行及其列，并将其粘贴在第一行下面，这样我就可以测试两个列之间的列。这一部分起作用了，但不幸的是，他们彼此粘着。它们之间没有空隙/填充物。我尝试在行和列中添加一个top:20，但这两个选项都不起作用，事实上，它使第二列的高度更短

有没有办法解决这个问题？这是React Native和Native Base

      <Content>
        <Grid style={Style.contentContainer}>
          <Row style={Style.content}>
            <Col>
              <Text>Test</Text>
              <View style={Style.completelyCenteredComponent}>
                <Text>Text here</Text>
              </View>
            </Col>
          </Row>
          
          <Row style={Style.content}>
            <Col>
              <Text>Test</Text>
              <View style={Style.completelyCenteredComponent}>
                <Text>Text here</Text>
              </View>
            </Col>
          </Row>    
        </Grid>
      </Content>

---

在我看来，尝试在样式的内容对象上添加边距

---

我想这会管用的。您在哪里添加了顶部：20样式中没有此类代码

您需要为您的内容添加

marginBottom

，并使用

marginBottom:0

为最后一行创建其他样式

你的风格：

content: {
    ... your style
    marginBottom: 20,
},
lastRow: {
    marginBottom: 0,
}

以及您的组件：

<Grid>
    <Row style={style.content}>...</Row>
    <Row style={[style.content, style.lastRow]}>...</Row>
</Grid>

...
...

如果你能在屏幕上显示你得到的东西，那就太好了。我去掉了最上面的20个，但它在下面。我会得到一个屏幕截图，稍后再发布。好的，给我所有使用的组件的代码，内容、网格、行、列。谢谢你的解决方案，它很有效。奇怪。。我肯定我也试过边距，也许我没拼出来。。这个解决方案奏效了，谢谢！我和25岁和20岁的marginBottom一起去喝marginTop。这是一个很好的输出！

<Grid>
    <Row style={style.content}>...</Row>
    <Row style={[style.content, style.lastRow]}>...</Row>
</Grid>