jhhan의 블로그

Vue.js에 대해서 적어보는 포스트입니다. 이번에는 제목처럼 slot 문법에 대해서 알아보겠습니다. 컴포넌트끼리 데이터를 전달하기 위해서, 특히 부모컴포넌트에서 자식컴포넌트로 데이터를 전달하려면 반드시 props를 사용해서 진행해야 합니다. 참고로 props 사용법입니다. // 부모 컴포넌트 // 자식 컴포넌트 // Example.vue 부모 컴포넌트에서 전송하고, 자식 컴포넌트에서 받아서 사용합니다. 정확하게 단계로 알아본다면 부모 컴포넌트에서 전송 자식 컴포넌트에서 받기 + 등록 자식 컴포넌트에서 사용 대략 3가지 단계입니다. 하지만 이런 단계들이 귀찮다고 여길 수도 있습니다. 이런 귀찮음을 해소해주는 문법이 바로 slot 문법입니다. // 부모 컴포넌트 테스트 // 자식 컴포넌트 - Example..

Vue.js를 요즘 공부하고 있고 기존에 해봤던 것을 다시 한번 하는 것이기 때문에 아직까지는 어려움이 없다. 그래도 이번에 정식으로 Vue.js를 공부하면서 새롭게 알게 된 내용들 or 중요하다고 생각하는 내용을 기록하려 한다. 이 글은 Vue.js에 대한 기본지식이 있어야 이해할 수 있을 것이다. (자세하게 적을 생각이 없다.. ㅎㅎ) 1. v-for v-for은 Vue에서 제공하는 반복문이다. 코드에서처럼 v-for를 사용해서 진행하고, :key="??"를 추가한다. :key="??"는 반복문을 돌면서 반복 요소들을 구분하는 속성이다. data가 될 수도 있고, (data, idx)의 경우에는 idx가 key역할을 할 것이다. 2. export , import export로 보내고 싶은 데이터를 설..