在React本地中使用ListView数据源中的可触摸高亮显示,可以通过以下步骤实现:
import React, { Component } from 'react';
import { ListView, TouchableHighlight, Text, View } from 'react-native';
const data = [
{ id: 1, name: 'Item 1' },
{ id: 2, name: 'Item 2' },
{ id: 3, name: 'Item 3' },
// 添加更多的数据项
];
constructor(props) {
super(props);
const ds = new ListView.DataSource({ rowHasChanged: (r1, r2) => r1 !== r2 });
this.state = {
dataSource: ds.cloneWithRows(data),
};
}
renderRow(rowData) {
return (
<TouchableHighlight
onPress={() => console.log('Item pressed:', rowData.name)}
underlayColor="#DDDDDD"
>
<View>
<Text>{rowData.name}</Text>
</View>
</TouchableHighlight>
);
}
render() {
return (
<ListView
dataSource={this.state.dataSource}
renderRow={this.renderRow}
/>
);
}
通过以上步骤,你可以在React本地中使用ListView数据源中的可触摸高亮显示。当用户点击列表项时,会在控制台输出相应的项名称,并且在触摸时会有高亮效果。
腾讯云相关产品和产品介绍链接地址:
领取专属 10元无门槛券
手把手带您无忧上云