WEB개발이야기/Vue.js 2019. 1. 15.
Vue 인스턴스의 라이프사이클
보통 프레임워크나 라이브러리의 경우 처리 순서에 따라 라이프사이클이 존재합니다. 사실 사람이 인식하기도 전에 순식간에 라이프사이클이 지나가 버리기 때문에 육안으로는 관찰이 거의 어렵습니다. 하지만 컴포넌트를 개발하거나 일반 개발 과정에서 라이프사이클은 중요한 요소로 작용을 합니다. 예를 들면, 분명 내 생각에는 A * ( B + C ) = D가 나와야 하는데 E가 나오는 경우가 발생을 합니다. 확실하게 D가 나와야 하는데 말이죠.. 이런 경우 십중팔구는 라이프사이클 때문 일 확률이 높습니다. 아직 순서 상으로( B + C )가 계산 되기도 전 인데 먼저 A * B를 계산해 버리는 경우 이런 문제가 발생할 수 있다는 것입니다. 그래서 라이프사이클을 이해하는 것은 나중에 심도있게 개발 할 때 중요한 요소 일..
WEB개발이야기/Vue.js 2019. 1. 11.
Vue 인스턴스의 주요 옵션 정리
Vue를 실행시기키 위해서는 먼저 Vue.js를 import를 한 후 Vue 인스턴스를 생성해야 합니다. Vue인스턴스를 생성할때 지정된 몇가지 옵션 객체를 전달해야 하는데 이 옵션객체들이 어떤것이 있고 어떻게 사용되는지 간단히 정리하려고 합니다. Vue 인스턴스란? Vue를 실행하기 위해 첫번째로 정의 하고 생성해야 하는 객체입니다. Vue 인스턴스 예제 var vm = new Vue ({ el : '#test', data : { name : '홍길동'}, }) 옵션 설명 예제 비고 el Vue가 실행될 HTML의 DOM 요소를 지정 el : '#test' CSS의 선택자를 선택하듯이 선택 (#--> id 지정, . --> 클레스 지정) data Vue가 바라보는 data 객체를 지정 data : { ..
