Vue.js 기반 데이터 바인딩과 디렉티브 활용
Vue.js 시작하기: 기본 설정과 데이터 렌더링
Vue를 사용하기 위해선 먼저 DOM 컨테이너를 준비하고, Vue 라이브러리를 로드한 후 인스턴스를 생성해야 합니다. 아래는 Vue 2 기준의 간단한 예제입니다.
<div id="app">
<p>이름: {{username}}</p>
<p>친구: {{friend.gender}}, {{friend.name}}</p>
</div>
<script src="htt ...
7월 22일 02:10에 게시됨
Vue 주요 지시어 정리
1. 조건부 렌더링: v-if, v-else, v-else-if
조건에 따라 요소의 존재 여부를 결정합니다.
v-if="조건": 조건이 참일 때만 요소 렌더링
v-else: v-if 또는 v-else-if 다음에 반드시 올 수 있으며, 조건이 거짓일 때 렌더링
v-else-if: 중간 조건 처리, 반드시 v-if 바로 뒤에 와야 함
<div id="app">
<div class="box" v-if="status === 'A'"></div&g ...
7월 14일 03:47에 게시됨