인프런 커뮤니티 질문&답변

컴포넌트에 props내릴때 질문 있습니다.

회사 프로젝트중에 팝업창을 띄울일이 있었고, 팝업창을 띄울때 데이터를 props로 넘겨줘야 할 일이 있어서

props로 넘겨줬습니다.

//팝업에 props로 데이터 넘겨주는 부분    
<MNGDA0030Popup
        ref="mNGDA0030Popup"
        :cmpny-div="searchPopupParam.CMPNY_DIV"
        :year="searchPopupParam.YEAR"
        :asgn-full-nm="ASGN_FULL_NM"
        :bsns-cd="searchPopupParam.BSNS_CD"
        :asgn-cd="searchPopupParam.ASGN_CD"
        :in-out="searchPopupParam.IN_OUT"
        :seq="searchPopupParam.SEQ"
      />


//props 받는부분
const props = defineProps({
  cmpnyDiv: {
    type: String,
    default: "",
  },
  year: {
    type: String,
    default: "",
  },
  asgnFullNm: {
    type: String,
    default: "",
  },
  bsnsCd: {
    type: String,
    default: "",
  },
  asgnCd: {
    type: String,
    default: "",
  },
  inOut: {
    type: String,
    default: "",
  },
  seq: {
    type: Number,
    default: "",
  },
})

let searchParams = reactive({
  CMPNY_DIV: useUserStore.company,
  YEAR: props.year,
  BSNS_CD: props.bsnsCd,
  ASGN_CD: props.asgnCd,
  IN_OUT: props.inOut,
  SEQ: props.seq,
})

console.log("프롭스", props)
console.log("서치파람", searchParams)

제 질문은

console.log("프롭스", props)

props를 콘솔 찍었을땐 값이 제대로 들어가는데,
searchParams에 따로 값을 할당해서 찍어보면 값이 들어가지 않습니다.

제 생각에는 props로 넘기고, 값을 할당했을때 반응성을 잃어 버린거 같습니다.

그래서 toRefs?로 감싸봤지만 해결하지는 못했습니다.

props.데이터 등으로 개발은 할수 있겠지만
searchParams에 props데이터를 할당 하는 방법이나 짐코딩님 강의중 어떤 부분을 다시 보면 될지 알수있을까요?