i have a flatlist and blur view component in the parent component, on press of the item in flat list im adding zindex to the selected item in flat list.

Expecting that the item should be visible over blur view component, but its not working.

Does the zindex property will not work if we use it in the render item of flatlist?

` sample

<FlatList
    ref={flatlistRef}
    data={Array(10).fill(1)}
    removeClippedSubviews={false}
    CellRendererComponent={({children}) => children}
    renderItem={({item, index}) => (
      <Items
        index={index}
      />
    )}
    showsVerticalScrollIndicator={false}
  />

  {openContextMenu ? (
    <BlurView
      style={styles.absolute}
      blurType="light"
      blurAmount={10}
      reducedTransparencyFallbackColor="white">
      
    </BlurView>
  ) : null}`

`items

<View style={{zIndex: 1}}>
  <TouchableOpacity activeOpacity={1} onPress={() => setOpenContextMenu(index + '')}>
    {isUser ? <RightMessage showAvatar isSelected /> : <LeftMessage />}
  </TouchableOpacity>
</View>

`

`I tried to use the component outside of flatlist component and its working as expected.

<Items
        index={index}
      />
<BlurView
      style={styles.absolute}
      blurType="light"
      blurAmount={10}
      reducedTransparencyFallbackColor="white">
      
    </BlurView>

`

How to resolve the zindex issue when using flatlist.