# emit
이벤트 emit 사용방법
이 글은 인프런의 캡틴판교님의 강의를 수강하면서 개인 공부를 위해 작성한 글입니다.\-> 저번 시간에 뷰의 경우 하위 컴포넌트는 상위 컴포넌트에게 이벤트를 발생시켜 전달 한다고 배웠는데, 이때 이벤트를 전달 시키는 것을 emit이라고 한다.\-> 뷰에서 클릭 이벤트를
(Vue) v-model 을 이용한 체크박스 컴포넌트 구현 -양방향 바인딩
v-model 을 이용해서 체크박스를 만들어보는 과제를 받았다. v-model 에 대한 개념을 잘 파악한 뒤, 우여곡절 끝에 체크박스를 구현하는데 성공했다. 그리고 여기서 그치지 않고 전체로 체크되는 체크박스도 한 번 구현해보았다.vue 에서는 부모에서 자식 컴포넌트로
Vue 페이지 구현(+props 전달)
✔️사용 이유로그 목록 조회 / 스케줄 목록 조회 총 2 화면에서 페이징 기능을 구현해야 했는데, 각 화면에서 페이징을 구현하기보다 페이징을 컴포넌트화해서 재사용하고자 함.자식 컴포넌트에게 props라는 특별한 속성으로, 데이터를 전달할 수 있다.자식 컴포넌트에게 이벤
VUE_TIL
Props & Emit 부모 => 자식 전달 부모 요소 views/ProjectDetailView.vue 자식요소 components/NavBar_detail.vue 자식 => 부모 : emit 사용
[Nuxt3] defineEmits를 이용하여 부모 컴포넌트로 변경된 값 보내기(emit)
자식 컴포넌트에서 부모 컴포넌트로 값을 전달props의 반대 개념이라고 생각하면 편함emit 변수에 넘길 값들 선언기존 define들과 다르게 ({ })이 아닌 <{ }>( ) 으로 선언 후 즉시실행 함수처럼 괄호를 추가매개변수e: 부모 컴포넌트에서 @를 이용해
Vue) 09. $emit()으로 props 데이터를 자식 컴포넌트에서 수정하기..
이전 문제점) > 📌 이전 props의 문제점 - 참고 자식 컴포넌트(ModalWindow.vue)인 모달창 컴포넌트에 존재하는 닫기버튼을 눌렀을 시, 부모 컴포넌트(App.vue)의 modalOpen값이 false가 되어야만 닫을 수 있었다. 하지만 props로
[Vue.js] props 로 상위 컴포넌트에서 하위 컴포넌트로 데이터 내리기
누군가에게 도움이 되었으면 ! Vue에서 상위 컴포넌트와 하위 컴포넌트간 통신이 이루어질 때 emit 과 props 를 사용한다저번에는 emit 을 설명했고 오늘은 props!
[2022.06.14] Vue 컴포넌트 - 컴포넌트간 데이터 전달, 커스텀이벤트($emit)
DetailView.vue 파일을 컴퍼넌트 폴더에 하나 만들었다.간단하게 모달창을 디자인했다.이제 App.vue 파일에서 방금 만든 DetailView 를 import하고 등록해서 사용하면 된다.그리고 모달 창이 처음부터 보여지면 안되므로 v-if 디렉티브를 사용하여
[vue] 모달 컴포넌트(modal $emit) 사용하기
디자인은 elementUI를 사용app.jsdialogFormVisible 데이터 값을 false로 설정 모달에 props로 data값 전달QuizModal.vueapp.js에서 버튼 눌러서 보여지고:visible="dialogFormVisible"모달 배경에 emi
20220127
D: - cmd - vue create vue_20220124 - vue3 - cd vue_20220124 - npm install vue-router@next --save - npm install vuex@next --save -npm install axios --s
Login.vue
부모 컴포넌트로부터 호출받는 값 props 자식 컴포넌트 내에 위치함 이런 형태. 부모컴포넌트에서는 CompProp.vue (부모) 이런형태로 불러와서 이렇게 컴포넌트를 불러와서 이렇게 사용한다. >자식 컴포넌트로부터 호출 받는 값 $emit
Vue.js 복습노트 2
vue의 컴포넌트 기반 개발의 핵심 특징하나의 컴포넌트는 .vue 확장자를 가진 하나의 파일 안에서 작성되는 코드의 결과물화면의 특정 영역에 대한 HTML CSS JavaScript 코드를 하나의 파일(.vue)에서 관리기본 HTML 엘리먼트를 확장하여 재사용 가능한