[React-Native] SectionList
SectionList는 말그대로 section이 나눠져있는 리스트뷰이다. 필요한 모듈 import {FlatList} from 'react-native'; 데이터 배열 선언 const DATA = [ { title: 'Main dishes', data: ['Pizza', 'Burger', 'Risotto'], }, { title: 'Sides', data: ['French Fries', 'Onion Rings', 'Fried Shrimps'], }, { title: 'Drinks', data: ['Water', 'Coke', 'Beer'], }, { title: 'Desserts', data: ['Cheese Cake', 'Ice Cream'], }, ]; 리스트 컴포넌트 디자인 data 배열로부터 it..
2022. 10. 15.
[React-Native] FlatList
모든 데이터를 한번에 불러와 리스트로 나타내는 ScrollView와 다르게 FlatList는 화면에 보이는 부분만 렌더링하는 차이가 있다. 따라서 데이터에 변화가 있을 경우에는 FlatList를 사용하는 편이 좋다. 필요한 모듈 import {FlatList} from 'react-native'; 데이터 배열 선언 리스트에 들어갈 데이터를 미리 선언해서 넣어보자. const Data = [ { id: 1, title: 'One', des: 'Touch this', }, { id: 2, title: 'Two', des: 'Touch this', }, { id: 3, title: 'Three', des: 'Touch this', }, { id: 4, title: 'Four', des: 'Touch this'..
2022. 10. 14.
