본문 바로가기

웹/Vue

[Vue] Computed 속성에 대해서
웹/Vue 2023. 3. 3. [Vue] Computed 속성에 대해서 🟩 Computed Computed는 대상으로 정한 data() 속성 값이 변했을 때, 이를 감지하고 자동으로 다시 연산해주며, 결과 값은 저장(캐싱)을 합니다.(Watch와 비슷하지만 Computed에서 중요한 부분은 결과 값을 "저장"하는 부분입니다. 캐싱이 포인트입니다) 🟩 computed 속성은 Vue.js 컴포넌트 내에서 객체 형태로 선언됩니다. 예를 들어 다음과 같은 코드로 fullName이라는 computed 속성을 정의할 수 있습니다. computed: { fullName() { return `${this.firstName} ${this.lastName}`; } } 🟩 computed 속성에 접근하기 computed 속성은 템플릿에서 {{ }}와 같은 보간법(interpolation)을 사..
[Vue] Vue3 컴포넌트 안에서 다른 컴포넌트를 쓰고 싶을 때
웹/Vue 2023. 1. 1. [Vue] Vue3 컴포넌트 안에서 다른 컴포넌트를 쓰고 싶을 때 🟩 components components는 import로 가져온 Vue 컴포넌트를 사용하기 위해 import 한 이름으로 등록합니다. 그리고 등록된 Vue 컴포넌트는 에서 태그로 사용되어야 합니다. Champion.vue라는 컴포넌트에서 BanPick.vue라는 컴포넌트를 쓰고 싶습니다. 🟩 그럴 때는 Champion.vue에서 Banpick컴포넌트의 export name을 import 해야합니다. Bacpick의 export name은 BanReccomend 이니 BanReccomend를 import 해줍니다. 🟩 그리고 Champion.vue에서 components라는 것으로 vue 객체에게 "컴포넌트안에 컴포넌트를 등록한다"는 표시를 해줍니다. 🟩 가져온 컴포넌트를 태그로 사용하면 됩니다.

티스토리툴바