[Vue.JS] 컴포넌트 (고급:slot)
1. Slot Content Your Profile 부모 컴포넌트에서 자식 컴포넌트를 위의 코드와 같이 사용하여 자식 컴포넌트의 하위 엘리먼트의 값들을 보여주고 싶다면, 위의 코드와 같이 자식 컴포넌트가 작성되어야 합니다. 위의 코드들이 랜더링 되면 엘리먼트는 Your Profile이라는 문구로 대체됩니다. 은 문자열 뿐만 아니라 모든 HTML과 대체 될 수 있습니다. Your Profile 위의 코드와 같은 기본 HTML 태그 뿐만 아니라, Your Profile 위의 코드와 같은 사용자 정의 컴포넌트도 과 대체 될 수 있습니다. 자식 컴포넌트에서 을 사용하지 않았다면, 부모 컴포넌트에서 자식 컴포넌트의 하위 엘리먼트로 넘겨 준 값들은 모두 무시 됩니다. 2. Named Slots 부모 컴포넌트에서 자..
[Vue.JS] 컴포넌트 (기본)
이번 포스트에서는 SPA에서 가장 중요하다 이야기 되는 컴포넌트에 관해 이야기 할 것입니다. 1. 기본 예제 // Define a new component called button-counter Vue.component('button-counter', { data: function () { return { count: 0 } }, template: 'You clicked me {{ count }} times.' });위의 예제는 라는 이름으로 재사용이 가능한 컴포넌트입니다. Vue.component('button-counter', { data: function () { return { count: 0 } }, template: 'You clicked me..