Java Scripts/Vue.js (36) 썸네일형 리스트형 Vue 3 Forms : Auto-importing components Finally, we import upperFirst and camelCase from Lodash, a JavaScript library that provides utility functions for common programming tasks. upperCase converts the first character of a string to upper case camelCase converts a string to camel case (camelCase isWritten likeThis) npm i --save lodash Lodash 의 upperFirst, camelCase functions 이 BaseInput.vue and base-input.vue , or baseInput.vue 로 만든 .. Vue 3 Forms - Base Select Form 에서 select element을 이용하여 option 을 선택하는 것을 재사용이 가능한 component 로 변경 하고자 한다. SimpleForm.vue 의 select element 를 별도의 file을 이용하여 componemt 화 한다. SimpleForm.vue Select a category {{ option }} Design Concept 별도의 file 을 이용하여 아래와 같이 재사용이 가능한 component 를 설계한다. BaseSelect.vue {{ label }} {{ option }} parent 에서 contents의 detail 을 변경하거나 제공할 수 있어야 한다. → label prop 를 추가한다 Making it v-model ready BaseSelect .. Vue 3 Forms - Base Input Creating reusable components for each specific input type will allow us to easily replicate them, modify them and also extend them. 각 입력 유형에 대해 재사용 가능한 구성 요소를 만드는 것은 우리로 하여금 이를 쉽게 복제하고 수정하고 확장하게 할 수 있다. Base Input SimpleForm.vue 에서 BaseInput.vue in our components folder 로 이전하는 과정을 통하여 reusable component 를 만든다. SimpleForm.vue Create an event Name & describe your event Title Description Submit Des.. Vue 3 Directive v-model https://ko.vuejs.org/guide/essentials/forms.html Form 입력 바인딩 | Vue.js VueConf Toronto - Join the premier Vue.js conference | 9-10 Nov 2023 - Toronto, CanadaView Schedule Use code VUEJS to get 15% off ko.vuejs.org Create a two-way binding on a form input element or a component. It automatically picks the correct way to update the element based on the input type. v-model 속성은 v-bind와 v-on의 .. 이전 1 2 3 4 5 다음