vue 공부중인데 이해 안가는 부분이 있습니다.

Question

================================= ================================= 이 부분이 이해가 안갑니다. 코드를 보시면 selectedDongList 빈 배열로 선언되어 있습니다. 제가 알기론 dong in selectedDongList 가 dong이라는 변수를 지정하는 거라는데 어쩨서 키와 벨류에 dong.dongCode 를 넣을수 있는거죠? dong에는 selectedDongList가 들어가있는 빈 배열밖에 없지 않나요??

ZERO개발자 · Answer

1.도시 미선택 -> selectedDongList: []2.도시 '서울' 선택 ->@change="changeCity" 이벤트 발생3. 해당 함수 실행 => changeCity() { this.selectedDongList = this.dongList.filter( (dong) => dong.cityCode === this.selectedCity ) } ->selectedDongList: ['{ cityCode: '02', dongCode: '1', dongTitle: '서울 1동' },{ cityCode: '02', dongCode: '2', dongTitle: '서울 2동' },{ cityCode: '02', dongCode: '3', dongTitle: '서울 3동' },{ cityCode: '02', dongCode: '4', dongTitle: '서울 4동' }]4. 생성

협군 · Answer

개발 공부할 때 가장 기초.대입, 조건, 반복

제가하는얘기는전부농담입니다 · Answer

최초에는 동 셀렉트박스에 옵션이 없습니다.(selectedDongList =[] 이므로)사용자가 도시 셀렉트박스에서 아무 옵션이나 선택하면 @change에 등록된 changeCity()를 호출합니다.changeCity 함수는 사용자가 도시 셀렉트박스에서 선택한 값(selectedCity)와 동일한 cityCode를 가진 dongList의 값들을 필터링해 selectedDongList에 대입합니다.(selectedDongList = [선택된 dongListItem])selectedDongList의 값이 변경되었으므로 동 셀렉트박스가 갱신됩니다.

vue 공부중인데 이해 안가는 부분이 있습니다.

3개의 답변

#ssr 목록