3주차 숙제로 찜 페이지를 만들고 있던 중에 다음과 같이 LikePage.js 코드로 실행하면 찜 페이지에 카드들이 쌓이는 게 아니라 하나 하나씩만 화면에 나타나는 걸 보았습니다. 그래서 route.params를 통해서 찜을 한 데이터를 가져와서 어떤 변수에 저장한 다음 map을 이용해서 LikePage.js를 통해 화면에 뿌릴려고 했습니다. 옳은 답인지 아닌지를 떠나서 route를 통해 가져온 데이터(딕셔너리형태)를 어떻게 변수에 저장할 수 있나요?? (혹시 제 설명이 부족하다면 댓글을 통해 표현해주세요!)

간단히 정리하면 route로 받은 딕셔너리 형태의 데이터를, route.params를 어떤 딕셔너리 형태로 저장하고 싶습니다.

state 는 useEffect를 안에 넣어서 그런가 계속 초기화가 되서... 화면이 새로 그려졌을 때 저장이 안된다고 생각했습니다.

import React,{useState,useEffect} from 'react';
import data from '../data.json';
import {View, Image, Text, StyleSheet,TouchableOpacity} from 'react-native'


//MainPage로 부터 navigation 속성을 전달받아 Card 컴포넌트 안에서 사용
export default function LikePage({navigation, route}){
    //Card.js에서 navigation.navigate 함수를 쓸때 두번째 인자로 content를 넘겨줬죠?
    //content는 딕셔너리 그 자체였으므로 route.params에 고대~로 남겨옵니다.
    //즉, route.params 는 content죠!
    const [tip, setTip] = useState([{
      "idx":3,
      "category":"재테크",
      "title":"잠자는 내 돈을 찾아라",
      "image": "https://storage.googleapis.com/sparta-image.appspot.com/lecture/money1.png",
      "desc":"‘새는 돈’에는 미처 몰랐던 카드 포인트, 휴면예금이나 환급금도 포함됩니다. 확실히 파악하지 못한 잠자는 돈을 찾아보고 자투리 돈들을 모으는 것도 중요합니다. 케이블방송, 위성방송 서비스를 이용하면서 중복 납부한 요금, 셋톱박스 보증금 등 돌려받지 않은 돈이 있는지 확인 해보세요. 또, 카드 포인트 통합 조회 서비스를 이용해 여러 개의 카드 포인트가 모두 얼마인지 체크해두는 것이 좋습니다. 보험해약 환급금, 휴면 보험금이나 휴면 예금을 찾아보고 돌려받는 일도 요즘에는 어렵지 않습니다.",
      "date":"2020.09.09"
  },
  {
      "idx":4,
      "category":"재테크",
      "title":"할인행사, 한정할인판매 문구의 함정 탈출!",
      "image": "https://storage.googleapis.com/sparta-image.appspot.com/lecture/money2.png",
      "desc":"‘안 사면 100% 할인’이라는 말 들어보셨나요? 견물생심, 좋은 물건을 보면 사고 싶기 마련입니다. 특히 대대적인 ‘할인 행사’ 중인 대형 마트에 갔을 때는 말할 것도 없겠죠. 따라서 생필품을 살 때, 한꺼번에 사서 사용하는 것보다 필요할 때 조금씩 구매하는 편이 좋습니다. 장을 보면서 대형마트에 자주 가다 보면 지금 필요한 것뿐 아니라 앞으로 필요할 것까지 사게 되어 지출이 커지기 때문입니다. 특히 할인 품목을 보면 뜻하지 않은 소비를 하는 경우도 많아진다. 홈쇼핑, 대형마트 등의 ‘할인행사’, ‘한정할인판매’ 등의 문구를 조심하세요. ",
      "date":"2020.09.09"
}])
    const tipDatas = {}
    useEffect(()=>{
      
//Card.js에서 navigation.navigate 함수를 쓸때 두번째 인자로 content를 넘겨줬죠?
//content는 딕셔너리 그 자체였으므로 route.params에 고대~로 남겨옵니다.
//즉, route.params 는 content죠!


      navigation.setOptions({
          //setOptions로 페이지 타이틀도 지정 가능하고
          title:'찜 목록',
          //StackNavigator에서 작성했던 옵션을 다시 수정할 수도 있습니다. 
          headerStyle: {
              backgroundColor: '#000',
              shadowColor: "#000",
          },
          headerTintColor: "#fff",
      })
        setTip(route.params) ------------------------------------------------------------------ 여기서 route.params로 찜 데이터를 가져오고 이 데이터                 를 어딘가에 저장하고 싶습니다!
     
        console.log(tip)
        console.log(tipDatas)
      },[])
      
  // //flag로 찜 하기를 한 해당 페이지에 값을 부여하고 그 값을 가진 데이터를 리스트화 시켜서 LikePage에 넣는다.
  //     const flag = (cate) => {
  //           setCateState(state.filter((d)=>{
  //               return d.category == cate
  //           }))
  //       }
    
  
  
  
  
      return(
        
        //카드 자체가 버튼역할로써 누르게되면 상세페이지로 넘어가게끔 TouchableOpacity를 사용
        <TouchableOpacity style={styles.card} onPress={()=>{navigation.navigate('DetailPage',route.params)}}>
                <Image style={styles.cardImage} source={{uri:tip.image}}/>
              <View style={styles.cardText}>
                  <Text style={styles.cardTitle} numberOfLines={1}>{tip.title}</Text>
                  <Text style={styles.cardDesc} numberOfLines={3}>{tip.desc}</Text>
                  <Text style={styles.cardDate}>{tip.date}</Text>
              </View>
          </TouchableOpacity>
      )
  }
  
  
  
  const styles = StyleSheet.create({
      
      card:{
        flex:1,
        flexDirection:"row",
        margin:10,
        borderBottomWidth:0.5,
        borderBottomColor:"#eee",
      paddingBottom:10
    },
    cardImage: {
      flex:1,
      width:100,
      height:100,
      borderRadius:10,
    },
    cardText: {
      flex:2,
      flexDirection:"column",
      marginLeft:10,
    },
    cardTitle: {
      fontSize:20,
      fontWeight:"700"
    },
    cardDesc: {
      fontSize:15
    },
    cardDate: {
      fontSize:10,
      color:"#A6A6A6",
    }
});