美文网首页
ReactNative中TouchableHighlight无效

ReactNative中TouchableHighlight无效

作者: Oo晨晨oO | 来源:发表于2017-09-12 10:52 被阅读261次

在RN中,如果想给列表视图的Cell添加点击效果, 可以使用TouchableHighlight控件. 但是要注意此控件一定要有onPress属性, 不然点击没有任何效果

renderMovieList = (movie) => {
    return(
      <TouchableHighlight 
      underlayColor="rgba(34, 26, 38, 0.1)" 
      //注意此处 实现了onPress属性
      onPress={()=>{
        console.log(`<<  ${movie.item.title}  >> 被点了`);
      }}
      >
        <View style={styles.item}>
          <View style={styles.itemImage}>
            <Image 
            source={{uri: movie.item.images.large}}
            style={styles.image}
            />
          </View>
          <View style={styles.itemContent}>
            <Text style={styles.itemHeader}>
            {movie.item.title}
            </Text>
            <Text style={styles.itemMeta}>
              {movie.item.original_title} ( {movie.item.year} )
            </Text>
            <Text style={styles.redText}>
              {movie.item.rating.average}
            </Text>
          </View>
        </View>
      </TouchableHighlight>
    );
  }

如果不需要有什么操作, 可以直接给onPress一个空的函数实现

onPress={()=>{}}

相关文章

网友评论

      本文标题:ReactNative中TouchableHighlight无效

      本文链接:https://www.haomeiwen.com/subject/befcsxtx.html