Css react native 容器样式

<View>
      {
        usersInfo.map((item) =>
        <View key={item.id} style={{}}>
        {Object.entries(item.intrest).map(([interestName, interestValue]) => (
        <View key={interestName} style={{ backgroundColor: interestValue === 'Games Online' ? '#6B7AED' : interestValue === 'Music' ? '#EE544A' : interestValue === 'Concert' ? '#FF8D5D' : interestValue === 'Movie' ? '#29D697' : '#6B7AED', borderRadius: 18,}}>
        <Text style={{ color: '#FFF', fontSize: 14, fontWeight: '500', paddingHorizontal: 15,paddingVertical: 7 }}>{interestValue}</Text>
        </View>
        ))}
        </View>
        )
        }
</View>

<View style={{flexDirection: 'row', flexWrap: 'wrap', width: '100%'}}>
   {usersInfo.map((item) => (
      ....
   )}
</View>

Css相关问答推荐

如何将bslib：：card()中的扩展按钮移到右上方，其中full_screen = TRUE？

CSS立方体覆盖

Primeng Angular更改p-dialog背景 colored颜色

VueJS CSS动画不会扩展到v-card/v-col之外

如何使用遮罩创建手绘SVG动画

如何让 v-col 变成可滚动的？

如何为图像堆叠效果下方的图层实现与磨砂玻璃类似的视觉效果

混合网格自动布局与固定的行列位置

没有字母间距的CSS悬停边框

更改行数时更改 CSS 网格列

CSS 字符串变量的正确null值是多少？

为什么 flexbox 中的 在应用居中时不会调整大小？

BootStrap：右对齐嵌套手风琴

如何为柔和的配色方案提供易于使用的高对比度替代方案？

如何使表格中一行的最后一个单元格占据所有剩余宽度

加载资源失败：服务器响应状态为 404(未找到)

CSSzoom 高度以匹配宽度 - 可能与外形尺寸

位置元素垂直固定，绝对水平

CSS3 box-shadow：inset 可以只做一侧或两侧吗？喜欢边界顶部？

如何根据容器大小设置字体大小？