React native 天然锌试剂

我尝试制作

FlatList

，其中圆的大小不同，对于每个圆，我需要有自己的

zIndex

圆圈中的数字显示zIndex数字，因为您看到它不起作用

我在

以下是我的组件：

<TouchableWithoutFeedback
        onPress={() => dispatch(selectHockeyPlayer(item))}
        style={[
          styles.listItem,
          {
            width: playerWidth,
            height: playerWidth,
            transform: [{scale: scaleNum + 1.2}],
            zIndex: Math.floor(scaleNum + 2),
          },
          isRated ? styles.isRated : null,
          styles.circle,
          activePlayer(item, styles.selectedListItem),
        ]}>

dispatch（选择曲棍球运动员（项目））}
风格={[
styles.listItem，
{
宽度：播放宽度，
身高：playerWidth，
转换：[{scale:scaleNum+1.2}]，
zIndex：数学层（scaleNum+2），
},
isRated？样式。isRated:空，
我的朋友圈，
activePlayer（项目，样式。selectedListItem），
]}>

将视图放置在TouchableWithoutFeedback的内部，并将TouchableWithoutFeedback样式应用于该视图

这样做

dispatch（选择曲棍球运动员（项目））}>

好吧，我找到了问题所在，

FlatList

与zIndex不兼容，所以我不得不使用

ScrollView

<TouchableWithoutFeedback
        onPress={() => dispatch(selectHockeyPlayer(item))}>
        <View
          style={[
          styles.listItem,
          {
            width: playerWidth,
            height: playerWidth,
            transform: [{scale: scaleNum + 1.2}],
            zIndex: Math.floor(scaleNum + 2),
          },
          isRated ? styles.isRated : null,
          styles.circle,
          activePlayer(item, styles.selectedListItem),
        ]}>