React-Native对齐标题的左，右后缀以及标题

Question

这是我面临的问题：

我在React Native中有一个称为Header的组件。页眉具有3个属性-左后缀（例如，用于后退按钮），右后缀（用于其他操作，有时是1个按钮，有时是2个按钮，有时没有按钮）和标题。

布局规则如下：

• 标题应始终位于标题的中心，无论是否存在右后缀或左后缀。如果存在右后缀，但不存在左后缀，则标题仍应位于标题的中间。
• 如果声明了右后缀和左后缀，则应始终可见。意思是如果我有Right Suffix + Left Suffix +一个很长的标题，标题应该缩小以留出后缀空间。

我做了点心来证明我的问题：https://snack.expo.io/@anjayka/header-challenge

如您所见，大多数布局都可以正常工作-如果添加右后缀，则标题保持在原位；如果删除左后缀，则标题仍在原位。问题出在标题是一个很长的文本之后-它扩展得如此之大，以致于它会完全排除后缀。

感谢您解决此难题的任何帮助

Answer 1

只需使用position: 'absolute'将图块包裹在View中，然后将图块Text居中居中，然后为标题Text样式赋予maxWidth属性