본문 바로가기

event

(2)
[Vue3] 컴포넌트 간 통신 (props, emit) 동일한 사진 데이터가 한 화면에 다양한 위치에서 여러 번 출력될 수 있다.하지만 해당 페이지를 구성하는 컴포넌트가 여러 개라면 각 컴포넌트가 개별적으로 동일한 데이터를 관리해야 할까?그렇다면 사진을 변경해야 할 때 모든 컴포넌트에 대해 변경 요청을 해야한다.=> "공통된 부모 컴포넌트에서 관리하자" 부모는 자식에게 데이터를 전달(pass props)하며, 자식은 자신에게 일어난 일을 부모에게 알림(emit events)Props- 부모 컴포넌트로부터 자식 컴포넌트로 데이터를 전달하는데 사용되는 속성- 모든 props는 자식 속성과 부모 속성 사이에 하향식 단방향 바인딩(one-way-down binding) 형성부모 속성이 업데이트되면 자식으로 흐르지만 그 반대는 안됨자식 컴포넌트 내부에서 props를 ..
[Vue3] 이벤트 핸들링 (v-on) 1. Inline Handlers- 주로 간단한 상황에 사용한다.- v-on은 생략하고 @만 쓸 수 있다. Add 1 Count: {{ count }} 2. Method Handlers- Inline handlers로는 불가능한 대부분의 상황에서 사용한다.- 기본 DOM Event 객체를 자동으로 수신한다. Hello  Inline Handler에서의 메서드 호출- 메서드 이름에 직접 바인딩하는 대신 Inline Handler에서 메서드를 호출할 수도 있다.- 이렇게 하면 기본 이벤트 대신 사용자 지정 인자를 전달할 수 있다. Inline Handlers에서의 event 인자에 접근하기- Inline Handlers에서 원래..