react native styledText에 스타일 컴포넌트로 touchableopacity속성을 주고 클릭시 onPress로 category가 바뀌고 카테고리에따라 styledText박스 style이 바뀌게 설정 setCategory("ct")} style={{ backgroundColor: category === "ct" ? "blue" : "#ccc" }} > 그리고 각 category에 따라 각각 다른 내용이 나오게 설정 했다. {todos .filter((t) => { return t.category === category; }) .map((todo) => { return ( {todo.text} setDone(todo.id)}> );
리액트 네이티브 Todolist 메인화면 만들기 기본적으로 Text, TextInput, View등 사용할 태그들은 모두 import해온 후 사용해야 한다. css스타일링 방법엔 inline styling StyleSheet Styled Component Tailwind 등이 있다. 이중에 styled component를 사용했는데 react native에서는 기본 사용했던 styled component가 아니라 emotion native (https://emotion.sh/docs/@emotion/native)를 사용하는게 편하고 호환이 잘 된다. 설치 후 npm install @emotion/react @emotion/native import import styled, { css } from '@em..
