【发布时间】：2019-10-24 22:14:55
【问题描述】：
这是我面临的问题：
我在 react native 中有一个名为 Header 的组件。 Header 有 3 个属性 - 左后缀（例如后退按钮）、右后缀（用于附加操作，有时 1 个按钮，有时 2 个按钮，有时没有）和标题。
布局规则如下：
- 无论是否存在右后缀或左后缀，标题都应始终位于标题的中心。如果存在右后缀但不存在左后缀，则标题仍应位于标题中间。
- 如果声明了右后缀和左后缀，则它们应该始终可见。这意味着如果我有右后缀 + 左后缀 + 一个很长的标题，标题应该缩小以为后缀腾出空间。
我做了点心来证明我的问题：https://snack.expo.io/@anjayka/header-challenge
如您所见，大部分布局都可以正常工作 - 如果我添加右后缀，标题保持在原位，如果我删除左后缀 - 它仍然在原位。问题出现在标题是一个非常长的文本之后 - 它扩展得如此之多以至于它完全推出了后缀。
感谢任何帮助解决这个难题
【问题讨论】：
标签： react-native layout flexbox react-native-flexbox