Reactivity 뷰의 핵심 기능!
# 데이터의 값이 바뀔때마다 계속 화면이 자동으로 그려지는것 뷰의 핵심인 Reactivity(반응성)이다.
#Object.defineProperty : 객체의 동작을 재정의하는 api
즉시실행 함수의 역할은 기본적으로 init과 render를
어떤 애플리케이션 로직에 노출되지않도록 또다른 유효범위(scope)에 넣어주어
관리해준다. (일반적으로 오픈 소스 라이브러리들은 이런 방식으로 관리된다)
즉시실행 함수 작성법 : (function(){})();
get: 속성에 접근했을 때의 동작을 정의
set: 속성에 값을 할당했을 때의 동작을 정의
위의 이미지에 Hello Vue는 처음에는 작성되어있지 않았으나
console창에서 viewModel.str = 'Hello Vue'; 를 입력하여 값을 변경해주었을때에
왼쪽 화면에 작성되었다.(Reactivity)
funtion render(value) : 값을 할당했을때에 set 펑션으로 전달하여
값이 전달된 즉시 화면에 변화가 일어나게한다
(div.innerHTML을 set 펑션안에 바로 넣고 사용하여도 상관없다)
'공부 > VUE.JS' 카테고리의 다른 글
6. 컴포넌트 통신 방식(props, 이벤트) (0) | 2021.12.13 |
---|---|
5. 뷰 컴포넌트 (0) | 2021.12.12 |
4. 뷰 인스턴스 (0) | 2021.12.11 |
3. Vue.js 뷰의 개발자 도구 (0) | 2021.12.10 |
1. VUE JS 시작 환경구성 + 참고 페이지 링크 (0) | 2021.12.08 |