React Native使用FlatList渲染列表

1.引入FlatList组件

import { FlatList } from 'react-native';

2.编写列表组件

class DeviceList extends Component {
	//转换时间戳
	getTime = (timeStamp) => {
		var date=new Date(parseInt(timeStamp)* 1000);
		var year=date.getFullYear();
		var mon = date.getMonth()+1;
		var day = date.getDate();
		var hours = date.getHours();
		var minu = date.getMinutes();
		var sec = date.getSeconds();

		return mon+'-'+day;
	}
	render() {
		return (
			 index.toString()}
				renderItem={({item,index}) => {
					return (
						
							
								{item.thingName}
								{this.getTime(item.statusUpdateTime)}
							
							
								
									Low
									DI_0
									
									DI_1
								
								
									Low
									DO_0
									
									DO_1
								
							
						)
				}}
			/>
		);
	}
}

3.效果图

注意事项

FlatList标签中必须加上keyExtractor={(item, index) => index.toString()}属性，否则会出现没有设置key值的警告