alignItems：'center'，不适用于 textInputs

Question

我目前正在尝试制作一个具有原生反应的应用程序，但我的样式有问题。 我在与按钮相同的视图中有 textInput，我想用alignItems: 'center'将它们居中，但它不适用于文本输入：

这是我的代码及其呈现的内容：

  textInputAndButtonContainer: {
    backgroundColor: 'white',
    display: 'flex',
    flexDirection: 'row',
    borderColor: 'black',
    borderWidth: 2,
    borderRadius: 11,
    alignItems: 'center',
    },

在你下面可以看到我真正想做的事情：

Answer 1

从上面的代码中，很明显您没有指定这是一个类名 (.) 还是一个 ID (#)

此外，您可以简单地使用填充将输入带到中心。 请参阅下面的代码

.textInputAndButtonContainer{
    padding: 20px;
    align-items:centre;
    Justify-content-:space-between;
}

Answer 2

首先删除display: 'flex' ，因此它是 rn 样式表中的默认设置。 之后尝试将下一个样式值放入容器样式中并检查这些值。

      alignItems: 'center',
      contentAlign: 'center',
      alignSelf: 'center',
      justifyContent: 'center'