hands on vue

[Lesson 25]

1. v-on:submit 의 prevent를 이용하여 form의 내용을 submit 한 뒤 form 이외의 내용이 flush 되지 않게 하라

2. right click 이용하여 버튼 클릭시 숫자를 변경하라

3. input박스에 엔터클릭시 이름이 보여지도록 하라 (힌트-> v-on:keyup.xxxxx)

------------------------

[Lesson 26]

1. 같은 counter라는 변수를 사용한다. 보여지는 건 starter, current 두가지다. starter는 0이고 current는 add,reduce 버튼으로 의해 변경된다. v-once를 이용하여 구현하라

 

단순한 기능을 연습한다고 생각할 수 있지만 데이터를 사용하면서 현 시점에서 잘 사용하는 패턴을 체득할 수 있다.

------------------------

[Lesson 27]

Data-binding

1. v-bind:value + v-on:click = v-model

v-bind & v-on을 함께 사용할 경우와 v-model만 사용할 경우

 

단방향 양방향에 대한 이해를 돕기 위해

아래 그림을 보며 더 자세히 살펴보자

v-bind는 name변수 값을 가져오고

v-on은 사용자가 입력한 이름이 name 변수값으로 설정한다.

 

만약

v-bind만 있을 경우에는?

 

사용자가 입력한 값이 name 변수에 값을 대입 하지 못함.