Vue 시작하기 1

Vue 강의 들으면서 내용 정리하기 !


object.defineproperty(대상객체, 객체의 속성, {

// 정의할 내용이 들어간다.

get // 속성에 접근했을때의 동작을 정의

set // 속성에 값을 할당했을때의 동작을 정의(new value 라는 새로 할당 된 값이 인자로 필요.) })

객체의 동작을 재정의 하는 api ( 동작을 우리 맘대로 바꿀 수 있다는 뜻)

할당할때마다 값이 reactivity 된다. 뷰의 핵심 !!
데이터의 변화를 라이브러리에서 감지해서 알아서 화면을 자동으로 그려주는것이 리액티비티


즉시실행함수 MDN

함수의 이름이 대문자다 » 생성자 함수를 의미 함수를 이용해서 어떤 정보를 담은 객체를 생성하는게 객체생성패턴

생성자 함수 MDN / prototype MDN


vue 인스턴스에서는
key : value 형식으로 존재
생성자 안에 인자는 객체

뷰 컴포넌트: 화면의 영역을 영역별로 구분해서 코드로 관리하는 것, 재사용성이 올라감

인스턴스를 생성하면 개발자도구에서 root 컴포넌트로 인식 > 이때 root 는 상위컴포넌트, 부모컴포넌트라고 부른다.

vue.component(‘컴포넌트 이름’, 컴포넌트 내용) > 전역컴포넌트 / 실제로는 많이 사용되지 않는다
new Vue 인스턴스 안에 components 안에 객체로 넣어준다 // (‘컴포넌트 이름’, 컴포넌트 내용) > 지역 컴포넌트(보통 컴포넌트를 여러개를 등록하기 때문에 s가 붙는다.)

차이점 : 지역컴포넌트는 특정 컴포넌트 하단에 어떤 컴포넌트가 등록됬는지 컴포넌츠 속성으로 바로 알수가 있다. 전역을 사용할 시에는 라이브러리나, 플러그인으로 사용하게 된다. 그렇기 때문에 일반적으로는 지역으로 사용을 한다. 또한 새로운 인스턴스에 컴포넌트를 추가하고 싶다면, 지역은 생성할때마다 등록해줘야하지만, 전역은 그럴 필요가 없다.

상위컴포넌트와 하위컴포넌트 : 위에서는 아래로 내려주고(프롭스 속성), 밑에서는 위로 이벤트를 올려줌(이벤트 발생)

프롭스 사용법 :

이벤트 사용법 :