[Vue.js] Template refs

🚀 템플릿 refs란? Props와 Event가 존재하지만, 자식 요소에 JavaScript를 이용해 직접 접근해야 할 때가 있는데, 이 때 `ref` 속성을 이용해 참조(Reference) ID를 자식 컴포넌트나, HTML 요소에 부여함으로 직접 접근하게 해 주는 것이에요. 위와 같이 컴포넌트가 Mount 되었을 때, 프로그래밍 적으로 input에 focus를 하고자 하는 경우 등에 유용하게 사용할 수 있는 것이에요. const app = Vue.createApp({}) app.component('base-input', { template: ` `, methods: { focusInput() { this.$refs.input.focus() } }, mounted() { this.focusInput()..

2022.03.19