FlatList.js

import React, { useState } from 'react';
import {
    Button,
    Text,
    View,
    FlatList,
} from 'react-native';

const FlatList3 =()=>
{
//    var aray = [
//         {name: 'anil', email: 'anil@test.com'},
//         {name: 'ahad', email: 'ahad@test.com'},
//         {name: 'Bilal', email: 'bilal@test.com'}
//     ]
    const [data, setData] = useState([
        {name: "Arsal", age: 21, email: "arsalsohail373@gmail.com"},
        {name: "Bilal", age: 24, email: "bilal@gmail.com"},
    ])
    return(
        <View>
            <Text style={{fontSize: 40, alignSelf: 'center', top:20}}>
                Flat List
            </Text>
            <FlatList
               data = {data} 
               renderItem={({item}) => 
               <Text style={{fontSize: 90}}>{item.name}</Text>
               }
               />
        </View>
    )
}
// class FlatList2 extends React.Component {
//     constructor() {
//         super()
//         this.state =
//         {
//             data2: [{
//                 name: "arsal",
//                 age: 20,
//                 email: "arsalsohail3732gmail.com"
//             },
//             { name: "ahmed", age: 21, email: "ahmed@gmail.com" }
//             ]

//         }
//     }
//     render() {
//         return (
//             <View>
//                 <Text>
//                     Flat List
//             </Text>
//                 <FlatList
//                     data={this.state.data2}
//                     renderItem={({ item }) =>
//                         <Text>{item.name}</Text>}
//                 />
//             </View>
//         )
//     }
// }
export default FlatList3;