Você está na página 1de 2

import React, { useState } from 'react';

import { StyleSheet, Text, View, FlatList, ScrollView } from 'react-native';

export default function App() {

const [num, setNum] = useState([

{número: '0', key:0},

{número: '1', key:1},

{número: '2', key:2},

{número: '3', key:3},

{número: '4', key:4},

{número: '5', key:5},

{número: '6', key:6},

{número: '7', key:7},

{número: '8', key:8},

{número: '9', key:9},

]);

return (

<ScrollView>

<View style={styles.container}>

<FlatList

numColumns={2}

keyExtractor={(item) => item.key}

data={num}

renderItem={({ item }) => (

<Text style={styles.item}> {item.número}</Text>


)}

/>

</View>

</ScrollView>

);
}

const styles = StyleSheet.create({

container: {

flex: 1,
marginTop: 30,
backgroundColor: '#fff',
alignItems: 'center',
justifyContent: 'center',

},

item: {

width: 150,
marginTop: 24,
padding: 30,
backgroundColor: 'purple',
color: 'white',
fontSize: 20,
margin: 10,

});

Você também pode gostar