서버에서 전달받은 데이터를 props로 넘겨서 v-for를 돌렸다. 그런데 자꾸 item이 unknown이라고 빨간줄을 그으며 분노하신다... diarys는 객체 배열인데 정확히 어떤 데이터가 오는지 몰라서 분노하신 것 같다... 그만하세요 타스 선생님 제발......😫 ... // diarys는 객체 배열인 props이다. props: { diarys: Array, }, ... // 정확한 item의 타입을 몰라 분노하는 것으로 추정 interface를 선언해서 as 키워드로 타입을 정해줘봤다. // 타입 선언 interface DiaryItemType { date: string; reason: string; level: number; } ... // as 키워드로 DiaryItemType[]라는 타입..
v-for 객체나 배열을 순회하여 html 요소를 만들어낸다. React에서의 map()과 비슷하다. key 속성은 React와 달리 필수는 아니지만 같은 이유로 사용하는 것이 권장된다. // 객체 배열로 v-for를 사용할 때 {{ item.name }} 객체 배열이 아닌 그냥 배열로도 사용가능하다. // 배열로 v-for을 사용할 때 {{ item }} 객체로 사용할 때 1번째 인자는 값, 2번째 인자로 키를 받아올 수 있다. // 객체로 v-for를 사용할 때 {{ key }}: {{ value }} ref React의 ref와는 다르게 DOM을 직접 조작하지 않는다. 요소 또는 컴포넌트 인스턴스에 대한 반응형 참조를 생성하는 방법으로 사용된다. 이를 통해 반응형 방식으로 기본 DOM 요소 또는 컴..
- Total
- Today
- Yesterday
- Typescript
- 제로초
- 드림코딩
- git
- 코드잇
- js
- 회고
- React
- Python
- 리액트
- javascript
- 자바스크립트
- vscode
- 타입스크립트
- 스파르타코딩클럽
- 김버그
- 깃
- 파이썬
- scss
- 코딩앙마
- 구름에듀
- 비주얼스튜디오코드
- TS
- 제이쿼리
- 저스트코드
- CSS
- Til
- html
- map
- vue
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |