React native React Native Flexbox-将一个项目放在垂直中心，另一个放在底部

在父视图中，我希望将一段文字垂直居中对齐，并在视图底部放置另一段文字。每当我添加底部文字时，它都会将垂直居中视图的位置向上移动（使其成为剩余空间的垂直中心）

如何保持文本相对于父视图垂直居中对齐？ 更新：我知道我可以用{position:'absolute'来做这件事， 底部：0}，但希望了解flex box解决方案

<View style={{height: 300, borderColor: "black", borderWidth: 1}}>
    <View style={{ justifyContent: "center", flex: 1 }}>
        <Text>Vert Middle</Text>
    </View>

    <View>
        <Text>Vert Bottom</Text>
    </View>
</View>

正中
垂直底

请尝试下面的代码

      <View style={{height: 300, borderColor: "balck", borderWidth: 1}}>
          <View style={{ backgroundColor: 'red', justifyContent: "center", flex: 1 }}>
              <Text>Vert Middle</Text>
          </View>

          <View style={{position: 'absolute', bottom: 0}}> // Here is your updations
              <Text>Vert Bottom</Text>
          </View>
      </View>

正中
//这是你的更新
垂直底

请尝试下面的代码

      <View style={{height: 300, borderColor: "balck", borderWidth: 1}}>
          <View style={{ backgroundColor: 'red', justifyContent: "center", flex: 1 }}>
              <Text>Vert Middle</Text>
          </View>

          <View style={{position: 'absolute', bottom: 0}}> // Here is your updations
              <Text>Vert Bottom</Text>
          </View>
      </View>

正中
//这是你的更新
垂直底

这将对您有效。此外，“尼提斯答案”也会起作用

render() {
    return (
        <View style={{
            height: 300,
            borderColor: "black",
            borderWidth: 1
        }}>
            <View style={{
                justifyContent: "center",
                flex: 1
            }}>
                <Text>Vert Middle</Text>
            </View>

            <View style={{
                height:0, //Here...
                justifyContent: "flex-end",
            }}>
                <Text>Vert Bottom</Text>
            </View>
        </View>
    );
}

render（）{
返回(
正中
垂直底
);
}

这将对您有效。此外，“尼提斯答案”也会起作用

render() {
    return (
        <View style={{
            height: 300,
            borderColor: "black",
            borderWidth: 1
        }}>
            <View style={{
                justifyContent: "center",
                flex: 1
            }}>
                <Text>Vert Middle</Text>
            </View>

            <View style={{
                height:0, //Here...
                justifyContent: "flex-end",
            }}>
                <Text>Vert Bottom</Text>
            </View>
        </View>
    );
}

render（）{
返回(
正中
垂直底
);
}

这对我不起作用。。。垂直中间文本位于水平中心上方。如果将“高度：0”添加到底部文本的视图中，它将居中。这对我不起作用。。。垂直中间文本位于水平中心上方。如果将高度：0添加到底部文本的视图中，它将居中。感谢共享。我的理解是使用绝对不是弹性盒的方式？关于如何使用flexbox进行此操作的任何提示？谢谢分享。我的理解是使用绝对不是弹性盒的方式？关于如何使用flexbox执行此操作的任何提示？