[VUE] 컴포넌트에 여러 개 v-model 사용하기 (props 값 바꾸기)
·
프로그램/VUE
안녕하세요! 프뚜(프로그래머 뚜)입니다! [개발 환경] - OS: windows 10 64bit - git: 2.37.1.windows.1 - nodejs: v16.16.0 - npm: 8.15.0 - yarn: 1.22.19 - @vue/cli(vue3): 5.0.8 컴포넌트에 값을 넘길 때 props를 사용합니다. 여러 개를 사용하게 된다면 :param이 여러 개가 추가 되는 형식이 됩니다. props의 값은 변경이 안 되기 때문에 emit을 통해 자식에서 부모의 function을 이용해서 변화시켜야합니다. props로 받은 데이터 값을 바꾸기 위해선 emit의 한 쌍이 필요합니다. 부모에게 받은 값(props)을 간단하게 변경할 수 있는 v-model에 대해 알아보도록 하겠습니다. ex) 기존 pr..
[VUE] <script setup> props, emit 사용하기
·
프로그램/VUE
안녕하세요! 프뚜(프로그래머 뚜)입니다! [개발 환경] - OS: windows 10 64bit - git: 2.37.1.windows.1 - nodejs: v16.16.0 - npm: 8.15.0 - yarn: 1.22.19 - @vue/cli(vue3): 5.0.8 vue에서는 props와 emit이 있습니다. - 자식 컴포넌트에서 부모 데이터 값 사용하기 (props) - 자식 컴포넌트에서 부모 function 사용하기 (emit, emits) 가 있습니다. (자세한 내용은 링크를 통해 확인할 수 있습니다.) vue3에서는 3. props를 통해 자식에서 부모의 데이터 출력하기 (자식에서 부모 데이터 출력하기) # Main.vue Main입니다. props.user > {{ props.user }}..
[VUE] 자식 컴포넌트에서 부모 function 사용하기 (emit, emits)
·
프로그램/VUE
안녕하세요! 프뚜(프로그래머 뚜)입니다! [개발 환경] - OS: windows 10 64bit - git: 2.37.1.windows.1 - nodejs: v16.16.0 - npm: 8.15.0 - yarn: 1.22.19 - @vue/cli(vue3): 5.0.8 vue에서는 component import를 자주 하게 됩니다. 자식 component에서 부모 component의 함수를 사용해야 할 일이 많습니다. 그럴 때 사용하는 함수가 emit입니다. 1. 자식(emit/EmitInfo.vue)에서 부모(App.vue) 함수 사용하기 App.vue(부모), EmitInfo.vue(자식) 구조입니다. 2. 자식 컴포넌트에서 emit 사용하기 setup 파라미터에는 props와 context가 있습니..
[VUE] 자식 컴포넌트에서 부모 데이터 값 사용하기 (props)
·
프로그램/VUE
안녕하세요! 프뚜(프로그래머 뚜)입니다! [개발 환경] - OS: windows 10 64bit - git: 2.37.1.windows.1 - nodejs: v16.16.0 - npm: 8.15.0 - yarn: 1.22.19 - @vue/cli(vue3): 5.0.8 vue에서는 component import를 자주 하게 됩니다. 자식 component가 부모 component의 값을 출력하거나 사용해야 할 일이 많습니다. 그럴 때 사용하는 함수가 props입니다. 1. 자식(props/MyInfo.vue)에서 부모(App.vue) 데이터를 사용하기 App.vue(부모), MyInfo.vue(자식) 구조입니다. 2. 자식 컴포넌트에서 props 사용하기 props는 배열 방식으로 여러 개를 받을 수 있..
프뚜
'Props' 태그의 글 목록