본문 바로가기

기타/Vue

(3)
mixins를 Vue의 Template에서 사용하는 방법 Mixins란? mixins는 Vue 컴포넌트에서 재사용 가능한 코드를 포함하는 객체이다. 이 객체는 다른 컴포넌트에서 import하여 사용할 수 있으며, 컴포넌트에 필요한 기능을 제공하거나 미리 정의된 동작을 적용하는 등의 역할을 할 수 있다. 즉, 여러 컴포넌트에서 공통으로 사용할 수 있는 코드를 모아놓은 것이다. Template에서 Mixins 사용하기 Mixins mixins에 currency라는 객체가 있다. 이 객체는 금액을 화폐에 맞게 ','나 소숫점 자리 등을 포맷팅해주는 기능이 들어있다. 아래는 mixins에 정의된 data와 method이다. 참고로, Object.freeze는 객체를 불변으로 만들기 위한 메소드이다. Vue Component Vue Component에서는 아래와 같이 ..
Vue Router 사용 요구 사항 검색 조건에 따라, 하단에 다른 테이블을 보여줘야하는 요구사항이 있었다. 아래와 같이, 검색 조건 부분까지 공통인데, 검색 시 Children Type이 First냐, Second냐에 따라 하단의 테이블이 달라져야 했다. Vue Router 사용 Vue Router를 사용해서 요구사항을 구현하기로 했다. Vue Router은 url Path에 따라 보여지는 자식 Component가 달라지는 것이다. 여기서는 Children Type이 First냐, Second냐에 따라 보여지는 테이블의 자식 Component가 달라지도록 한다. Children Type URL 자식 Component First /test/firstChild ChildrenFirst Second /test/secondChild ..
Vue 강의 & 유용한 사이트 정리 Vue 강의: https://www.youtube.com/watch?v=b0ImUEsqaAA Vue 정리된 사이트: https://joshua1988.github.io/vue-camp/textbook.html Introduction | Cracking Vue.js 최종 변경일: 2022. 7. 1. 오전 12:48:57 joshua1988.github.io