FACTS(사실, 객관) : 내가 한 일
개인과제 목업파일에 있는 리스트를 화면에 뿌려주는 것 + 나만의 포켓몬에 추가/제거하는 add함수, remove함수를 작성,
여차저차 이렇게
리스트들이 보이긴 했는데
카드를 누르면 카드 상세페이지로, 추가버튼을 누르면 나만의 포켓몬에 추가되어야 하는데 어딜 눌러도 상세페이지로 이동하는 문제가 생김
<Card onClick={() => navigate("/pokemon-detail?id=" + pokemon.id)}>
<img src={pokemon.img_url} alt={""} />
<h3>{pokemon.korean_name}</h3>
<PokemonNum>No. {pokemon.id}</PokemonNum>
{isSelected ? (
<Button onClick={() => {onRemove(pokemon);}}>삭제</Button>
) : (
<Button onClick={() => {onAdd(pokemon);}}>추가</Button>
)}
</Card>
대체 뭐가 문제일지
그리고 두번째로, 상세페이지에서 뒤로가기를 누르면 아무 화면도 뜨지않음! 그냥 하얀 화면만 뜨는데 url을 확인해보면 페이지는 정상적으로 이동함! 근데 아무것도 표시되지 않다가 새로고침하면 정상적으로 보이고 navigate함수를 잘못쓰고있는건지..?
=> 다시 살펴보니 아직 디테일페이지에 해당하는 jsx파일을 안만듦! 만들어서 연결시켜보면 어떻게든 되지않을까!
FEELINGS(느낌, 주관) : 나의 감정적인 반응, 느낌
나중에 contextAPI로 리팩토링하라곤 하셨지만, 이렇게 밑으로 여러 컴포넌트들을 엮어서 props로 이거저거 주거니 받거니 하는게 너무 헷갈리고 어렵다
FINDINGS(배운 것) : 그 상황으로부터 내가 배운 것, 얻은 것
FUTURE(미래) : 배운 것을 미래에는 어떻게 적용할 지