웹 개발/학습 일지 2

Udemy - Vue 완벽 가이드 2.기초 및 핵심 개념 - Vue를 이용한 DOM 상호작용

2. 기초 및 핵심 개념 - Vue를 이용한 DOM 상호작용computed: 메서드처럼 함수형태로 쓰지만 호출할때 ()를 붙이지 않음(데이터 프로퍼티처럼 써야함)단순계산으로 나오는 값을 표시해야되는 경우 사용값이 변경되면 watcher처럼 computed의 값도 변경됨데이터 바인딩에만 사용됨watcher: 어떤 값을 감시하는데 사용computed와 비슷하게 연산에 사용 가능하지만, 두 개 이상의 변수를 같이 연산할 때는 번거로우니 computed를 쓰는 게 나음computed나 watch, data같은 다른 프로퍼티 안의 블록에서 data를 사용하려면 const data = this 처럼 this를 선언해서 사용해야함동적 스타일링vue 데이터를 사용하여 스타일링을 동적으로 처리할 수 있다.:style=”..

Udemy - Vue 완벽 가이드 1. 시작하기

이 포스팅은 Udemy 강의를 들으며 필기한 내용을 적은 것이다. - Vue 시작하기VSCode에서 코드 Beautify : Shift + Alt + F포매터 없으면 prettier 검색해서 추가cdn으로 Vue 가져올 때 스크립트 변경Vue 앱 생성하기const app = Vue.createApp();app.mount(".user-goal");data, methods를 다른 프로퍼티로 뺐을 경우 methods에서 data에 선언한 변수를 쓰려면 this.를 붙여야함v-html 디렉티브// v-html 속성으로 HTML 태그가 포함된 문자열을 출력 가능 methods: { outputGoal() { const randomNumber= Math.random(); if (randomNumber Learn ..