반응형 Vue.js 튜토리얼3 Vue.js 시작하기 - #4 컴포넌트를 사용한 작성방법 컴포넌트 시스템은 Vue의 또 다른 중요한 개념입니다. 이는 작고 그 자체로 제 기능을 하며 재사용할 수 있는 컴포넌트로 구성된 대규모 응용 프로그램을 구축할 수 있게 해주는 추상적 개념입니다. 생각해보면 거의 모든 유형의 응용 프로그램 인터페이스를 컴포넌트 트리로 추상화할 수 있습니다. Vue에서, 컴포넌트는 본질적으로 미리 정의된 옵션을 가진 Vue 인스턴스 입니다. Vue에서 컴포넌트를 등록하는 방법은 간단합니다. // todo-item 이름을 가진 컴포넌트를 정의합니다 Vue.component('todo-item', { template: '할일 항목 하나입니다.' }) 이제 다른 컴포넌트의 템플릿에서 이 컴포넌트를 사용할 수 있습니다. 그러나 이는 모든 할 일 인스턴스에 똑같은 내용을 렌더링할 것.. 2019. 5. 8. Vue.js 시작하기 - #2 조건문과 반복문 엘리먼트의 존재 여부를 토글하는 것은 아주 간단합니다. 이제 나를 볼 수 있어요 var app3 = new Vue({ el: '#app-3', data: { seen: true } }) 콘솔에서 app3.seen = false 를 입력해보세요. 메시지가 사라지는 것을 확인할 수 있습니다. 이 예제는 텍스트와 속성뿐 아니라 DOM의 구조에도 데이터를 바인딩 할 수 있음을 보여줍니다. 또한 Vue 엘리먼트가 Vue에 삽입/갱신/제거될 때 자동으로 트랜지션 효과를 적용할 수 있는 강력한 시스템을 제공합니다. 몇가지 디렉티브가 있습니다. 각 디렉티브마다 고유한 기능이 있습니다. 예를 들어 v-for 디렉티브는 배열의 데이터를 사용해 항목 목록을 표시하는데 사용할 수 있습니다. {{ todo.text }} var.. 2019. 5. 8. Vue.js와 Django를 이용한 웹앱 만들기 Build an App with VueJS and Django Part One를 참고하여 작성하였습니다. 서론 이전에 VueJS와 ExpressJS를 이용하여 웹앱을 만든적이 있는데, Python 공부도 할 겸 Django를 써보려고 하는데 VueJS와 Django를 결합? 연결하는데 어려움이 있어 자료를 찾던 중 좋은 소스가 있어 공유합니다. Vue.js Vue.js는 사용자 인터페이스를 만들기 위한 진보적인 프레임워크입니다. 다른 단일형 프레임워크와 달리 Vue는 점진적으로 채택할 수 있도록 설계하였습니다. 핵심 라이브러리는 뷰 레이어만 초점을 맞추어 다른 라이브러리나 기존 프로젝트와의 통합이 매우 쉽습니다. 그리고 Vue는 현대적 도구 및 지원하는 라이브러리와 함께 사용한다면 정교한 단일 페이지 응.. 2019. 5. 1. 이전 1 다음 반응형
