반응형

2022/08 42

76. render 함수

render 함수 란? -render 함수의 역할 : render 함수는template와 마찬가지로 html 템플릿을 만들지만 일부 장면에서 template로 실현하면 코드가 지루하고 번거로우며 대량으로 중복되기 때문에 이때 render 함수를 사용한다. - render 방법의 실질은template 템플릿을 생성하는 것이다. - 하나의 방법을 호출하여 생성하고 이 방법은render 방법의 매개 변수를 통해 전달한다. - 이 방법은 세 가지 파라미터가 있는데 각각 라벨 이름, 라벨 관련 속성, 라벨 내부의 html 내용을 제공한다. - 이 세 가지 파라미터를 통해 완전한 템플릿을 생성할 수 있다 - vue는 가상 DOM이기 때문에template 템플릿을 받을 때도 VNode 함수로 번역하고 render 함..

vue.js/vue.js 2 2022.08.21

75. 컴포넌트 디자인 패턴 (common, slot, Controlled, Renderless )

컴포넌트 디자인 패턴 1. Common - 기본적인 컴포넌트 등록과 컴포넌트 통신 {{ title }} {{item}} renew items 2. Slot - 마크업 확장이 가능한 컴포넌트 slot은 데이터는 위에있음 아래 컴포넌트에서 데이터를 표현만 해줄뿐 slot을 왜 쓸까? - 요구사항이 바뀔때를 대비, 유연하게 화면의 영역을 확장 할 수 있다. {{ item }} 아이템 1 아이템 2 click me 아이템 3 아이템 4 3. Controlled - 결합력이 높은 컴포넌트 - 하위에서 관리해야 했던 데이터를 상위에서 관리하게 하는 방법 - 컴포넌트에 데이터 의존성 분리 4. Renderless - 데이터 처리 컴포넌트 {{ response }} loading... name : {{ response..

vue.js/vue.js 2 2022.08.15
반응형