React Native Text组件不wrap
起因
如果 wrapp 的 flex-direction 为 row 的时候，Text 内部不自动 wrap。还是测试拿给我看，才发现某些机型会存在这种问题。
开始以为是 Text 内部会根据flexbox而有不同的展现，但是翻阅官方文档：
The
element is unique relative to layout: everything inside is no longer using the Flexbox layout but using text layout. This means that elements inside of a are no longer rectangles, but wrap when they see the end of the line.
Text 组件内部默认是 wrap 的，除非这一整个是一个超长的单词，否则就会在 white space 的时候自动 break 了。
如果给 wrapp 设置 wrap，那么整个 text 直接就 wrap 到下一行，icon 单独一行了。（这部分官方是有案例的，根据 Text 外部的 Container，wrap 也是不一样的）
好嘛，到底是什么东西导致的？为什么 flex-direction: row 就给我炸了？
原因: element 的宽度计算方式导致的
解决
官方的解释：每个 element 的 size 大致可以分为两种方式：
- content-driven
- parent-driven
- flex-direction: column 的时候，宽度首先由 content-driven，然后再由 parent-driven，高度直接由 content-driven，完美，一点问题没有。
- flex-direction: row 的时候：高度由 comtent-driven，宽度呢？那当然是 content-driven 啊！ … 不好意思，Text 无法计算自己的 width，why？因为 Text 是 autosize 的！（也有意外情况，如果你把 Text 给 absolute 起来，那么就可以计算了）。所以此时的 Text 的 width，是由 parent-driven，也就是整个 wrapper 的宽度了。
解决方法也很简单，Text 上挂一个 flexShrink: 1，让它自己玩去吧。