Front End/React Native
React Native ScrollView
YJ_SW
2021. 1. 18. 14:39
728x90
ReactNative ScrollView
export default function App() {
const [people, setPeople] = useState([
{name:'aaa',key:'1'},
{name:'bbb',key:'2'},
{name:'ccc',key:'3'},
{name:'ddd',key:'4'},
{name:'eee',key:'5'},
{name:'fff',key:'6'},
{name:'ggg',key:'7'},
])
return (
<View style={styles.container}>
<ScrollView>
{people.map((item)=>{
return (
<View key={item.key}>
<Text style={styles.item}>{item.name}</Text>
</View>
)
})}
</ScrollView>
</View>
);
}
코드 리팩토링 후
map 인자 하나니까 () 없애고, {return } 제거
return (
<View style={styles.container}>
<ScrollView>
{people.map(item=>
(
<View key={item.key}>
<Text style={styles.item}>{item.name}</Text>
</View>
))}
</ScrollView>
</View>
);
}
728x90