vue.js

  1. v-if 2. v-show v-if와 차이점은 v-show가 있는 엘리먼트는 항상 렌더링 되고 DOM에 남아 있다는 것입니다. display CSS 속성만 전환한다. v-show는 <template> 엘리먼트를 지원하지 않는다. 또한 v-else와 상호작용하지 않는다. 3. v-if? v-show?   v-if v-show 렌더링 참일 때만 렌더링 항상 전환 비용 크다 적다 초기 렌더링 비용 적다 크다 용도 런타임 시 조건이 변경될 … 더 읽기

1. ref() Composition API에서 반응형 상태를 선언하는 권장 방법이다. ref()의 인자로 전달되면 ref object로 wrapped되어 반환된다. 이때 .value 프로퍼티를 가진다. 가. 왜 씀? ref()를 사용하면 변수의 값이 변경될 때 Vue.js가 자동으로 이 변경을 감지하고 DOM을 적절하게 업데이트한다. 이것이 가능한 이유는 Vue가 컴포넌트를 처음 렌더링할 때부터, 모든 ref를 기억,추적하기 때문이다. 표준 JavaScript에서는 일반 변수의 접근이나 변형을 … 더 읽기

0. 출처 Vue.js Vue.js – The Progressive JavaScript Framework 1. Directive v- 접두사가 있는 특수한 속성. 디렉티브 설명 v-bind 데이터와 속성이나 요소, 컴포넌트 props를 바인딩 v-on 이벤트 리스너를 추가 v-if 조건에 따라 요소를 렌더링 v-else v-if의 “else” 블록 v-else-if v-if의 “else if” 블록 v-for 배열을 기반으로 요소를 반복 v-model 양방향 데이터 바인딩 v-show 조건에 따라 … 더 읽기

1. Template Syntax Vue.js Vue.js – The Progressive JavaScript Framework 가. Text Interpolation 가장 기본적인 데이터 바인딩 방식이다. Mustache syntax (콧수염 구문)을 사용한다. Mustache syntax tag는 상응하는 컴포넌트 인스턴스의 msg 프로퍼티의 값으로 대체된다. 또한 msg 프로퍼티의 값이 변경되면 언제든지 업데이트된다! 나. Raw HTML Mustache syntax는 plain text로 해석된다. 만약 plain text가 아닌 HTML로 해석되기 원한다면 … 더 읽기

1. SPA란? 웹 페이지에서 하는 일이 많아지면서 웹 페이지를 더 빠르게 로딩하기 위해 등장한 기술이다. SPA는 한 번 웹 페이지를 로드한 후, 사용자와 상호작용하면서 동적으로 페이지를 업데이트. 전체 페이지를 다시 로드하지 않고 필요한 부분만 로드한다. 서버로부터 네트워크 트래픽을 줄이고, 사용자 경험을 향상한다. 2. CSR란? 3. Vue.js란? Vue.js Vue.js – The Progressive JavaScript Framework Vue.js는 Evan … 더 읽기