NativeBase CardItem Text不合适？

Question

我正在使用react-native + mobx + nativebase。我正在迭代一个对象数组。我正在使用NativeBase Card component。我对UI的问题不合适。见下文：

注意＆＃34;汉堡包＆＃34;看起来很时髦。我发现这是由于＆＃34;汉堡包＆＃34;这个词的长度造成的。当我把它缩短到＆＃34; Burgers＆＃34;时，它看起来很好。见下文：

这是代码。注意：recipeStore.categories是一个对象数组。

=JOIN(CHAR(10),SPLIT(REGEXREPLACE(A1, "(.{50})", "/$1"),"/"))

我将需要预测未来更长的词。如果我得到一个更长的菜单，我不介意让它溢出到下一行。如下所示：

如何使我的卡能够处理长字溢出？

Answer 1

Haven并没有完全复制你的内容，但以下内容可行。 在<CardItem footer>中，<Left>和<Right>默认会占用相等的空间。 使用 flex 属性允许<Right>宽于<Left>

   <CardItem footer style={{flex:4}}>
        <Left style={{flex:1}}>
           <Ionicons name="ios-microphone"/>
        </Left>
        <Right style={{flex:3}}>
          <Text>Hamburgerrrrsssssssss</Text>
        </Right>
   </CardItem>