컴포넌트
-
[Vue.js] 라이프사이클 훅 (Lifecycle Hooks)📗 Vue.js 2025. 4. 16. 16:27
포스팅 이전에 앞서 💡 Vue.js의 라이프사이클(Lifecycle)이란?Vue 컴포넌트는 단순히 한 번 만들어지고 끝나는 게 아니라, 탄생부터 소멸까지 일련의 단계를 거칩니다. 이 과정을 컴포넌트 생명주기(Lifecycle)라고 부릅니다.쉽게 말하면, 컴포넌트가생성되고 (create), DOM에 붙고 (mount), 업데이트되고 (update), 사라지기까지 (unmount) 이 전체 흐름을 Vue가 내부적으로 관리하고 있으며, 가장 중요한 요소는특정 시점마다 실행할 코드를 직접 작성할 수 있다는 것입니다. 이때 사용하는 게 바로! 라이프사이클 훅(Lifecycle Hooks) 입니다. Vue 3에서는 컴포넌트의 생명주기 동안 특정 시점에 실행할 수 있는 라이프사이클 훅(Lifecycle Hooks)..
-
[Vue.js] 컴포넌트 개념 및 사용법📗 Vue.js 2024. 10. 16. 13:44
1. 컴포넌트란?Vue에서 컴포넌트는 UI의 재사용 가능한 단위입니다.주로 Vue에서 화면의 영역을 구분하여 개발하는데 사용합니다. 그럼 컴포넌트를 사용하는 이유는?🤷♂️코드의 가독성을 높인다.유지보수가 용이하다.코드의 중복을 줄일 수 잇다.Vue에서는 각 컴포넌트는 고유의 데이터, 메서드, 템플릿을 가지고 동작합니다.페이지에서 주로 Header, Body, Footer와 같은 UI 요소를 컴포넌트로 만들고,다른 곳에서도 재사용할 수 있어 관리가 편합니다. 컴포넌트를 설명하면서 추가로 말씀드리면,이전까지의 Vue2에서의 컴포넌트는 options API를 기반으로 작성되었습니다.하지만 Vue3에서는 Composition API가 도입되었고,그 중에서도 {{ doubleCount }} ..