interpolation

했던것들/Vue.JS

interpolation과 v-bind 및 vue cdn 내부동작 추론

학습결과 interpolation(보간법)은 태그 내부의 텍스트 노드를 채워넣을 때 쓸 수 있다. ex) {{ vuedata }} v-bind는 태그의 어트리뷰트에 데이터를 바인딩 시켜줄 때 사용할 수 있다. ex) 주소를 눌러요 VUE 내부동작 추론 최상단에 vue가 cdn으로 설치가 되어있기 때문에 vue 문법을 사용할 수 있게 된다. vue는 html 상단에서 vue cdn과 app.js를 defer로 미리 다운로드한 뒤 HTML 파싱이 끝날때까지 대기한다. (defer 키워드로 인해 js코드 다운로드와 html 파싱이 동시에 이루어지나, js의 실행은 html 파싱이 전부 이뤄진 뒤 실행된다. 따라서 vue의 내부 동작은 js가 dom을 변경함으로써 이뤄질 것이다.) HTML 파싱이 끝난 뒤, v..

했던것들/Vue.JS

Vue App 인스턴스 생성 및 연결 + 데이터 바인딩

학습목적 CDN 방식을 통해 먼저 vue와 친숙해져보자. 기본이라 할 수 있는 Options API를 한번 사용해보자. index.html Vue Course Goals {{ courseGoal }} My Course Goal {{ courseGoal }} script를 통해 vue를 cdn으로 사용했다. (js는 defer 프로퍼티를 이용해 화면이 렌더링이 된 이후 실행이 되도록 한다.) body안의 {{ courseGoal }} 은 보간법(interpolation) 이라는 vue 특유의 데이터 바인딩 기법이다. html과 vue가 결합된 형태에서는 vue가 특수구문을 읽어들여 html을 다르게 파싱하게 한다. app.js const app = Vue.createApp({ data() { return ..

2DC
'interpolation' 태그의 글 목록