React Native FlatList onPress for child

问题描述:

我正尝试为嵌套在React Native FlatList中的图像建立一个按下处理程序。我已经验证该函数是通过道具传递的,通过直接在组件内调用函数并且工作正常。以下是一个简化的测试案例。我也尝试在图像上设置onPress,结果相同。React Native FlatList onPress for child

const PostList = ({posts, onActLike, currentUser}) => { 
    return (
    <FlatList 
     data={ posts } 
     keyExtractor={ (item) => item.id } 
     renderItem={ ({item}) => { 
     return (
      <View> 
      <Image 
       source={ {uri: item.media.url} } 
       resizeMode="cover" 
      /> 
      <View> 
       <View 
       onPress={ (item) => { 
        onActLike(item); 
       } } 
       > 
       { 
        currentUser.likedMedia.indexOf(item.id) > -1 && 
        <Image 
         source={ require('../assets/images/like_filled.png') } 
         style={ {width: 20, height: 17} } 
         resizeMode='contain' 
        /> 
       } 
       { 
        currentUser.likedMedia.indexOf(item.id) === -1 && 
        <Image 
         source={ require('../assets/images/like_unfilled.png') } 
         style={ {width: 20, height: 17} } 
         resizeMode='contain' 
        /> 
       } 
       </View> 
      </View> 
      </View> 
     ) 
     } } 
    /> 
) 
} 

View不接受onPress功能也不Image。您需要将视图包裹在触摸中(TouchableOpacity,TouchableHighlight等)