vue3 Vue: 템플릿 문법에 대해서 (2) 디렉티브Vue에서 사용되는 HTML 요소에 특별한 동작이나 기능을 부여하는데 사용되는 특수 속성이다.디렉티브설명v-text엘리먼트의 textContent를 업데이트 한다.v-html엘리먼트의 innerHTML을 업데이트 한다.v-show참-거짓을 기반으로 CSS 속성 중 display 를 전환한다. 초기 조건과 관계없이 항상 렌더링된다.v-if참-거짓에 따라 엘리먼트를 조건부로 렌더링한다.v-elsev-if 또는 v-else-if의 'else block'을 나타낸다. v-for엘리먼트 또는 템플릿 블록을 여러번 렌더링한다. v-on이벤트 리스너를 추가한다. ( 단축문법 : @ )v-bindHTML 요소의 속성을 Vue인스턴스의 데이터와 동적으로 바인딩한다. (단축문법 : : 혹은 . ) v-model양.. 2024. 10. 17. Vue: 템플릿 문법에 대해서 (1) Vue의 템플릿 문법은 HTML을 기반으로 하여, 데이터와 상호작용하며 동적으로 콘텐츠를 렌더링하는 역할을 한다. Vue 기본 문법createApp : Vue 애플리케이션을 시작하는 함수로, Vue 인스턴스를 생성한다. component data : 컴포넌트의 데이터를 반환하는 함수다. methods : 컴포넌트 인스턴스에 메서드를 추가한다. template : Vue 애플리케이션의 구조와 레이아웃을 정의한다. props : 부모 컴포넌트로부터 데이터를 전달받는다. mount : Vue 애플리케이션 인스턴스를 특정 DOM 요소에 연결하는 함수이다. 템플릿 문법데이터 바인딩이중 중괄호를 사용하여 데이터를 바인딩 할 수 있다. 이중 중괄호 안의 데이터는 해당 컴포넌트 인스턴스의 속성 값으로 대체된다. .. 2024. 10. 8. Vue : 시작하기 Vue.js - The Progressive JavaScript Framework | Vue.js Vue.jsVue.js - The Progressive JavaScript Frameworkvuejs.org Vue는 프론트앤드 프레임워크로 HTML, CSS, JavaScript를 기반으로 한 템플릿을 제공한다. Vue를 사용하는 방법은 크게 두 가지로 나눌 수 있다. CDN (Content Delivery Network) 스크립트 태그를 통해서 직접 Vue를 사용할 수 있다. Vue CLIVue.js기반의 프로젝트를 생성하고 관리하는데 사용되는 도구로, 복잡한 설정 없이도 기본적인 구조와 파일을 자동으로 생성해준다. 컴퓨터 환경 전역에 Vue CLI를 설치하여, 이후 Vue 프로젝트 생성 시에 간편한 .. 2024. 10. 8. 이전 1 다음