3.props etc

https://kr.vuejs.org/v2/guide/components.html

공식가이드

*사용자 정의 이벤트를 사용하여 입력 컴포넌트 만들기

사용자 정의 이벤트는 v-model에서 작동하는 사용자 정의 입력을 만드는데 사용 가능

1과 2는 같은 문장임

1) hhml

<input v-model="something">

2) html

<input
  v-bind:value="something"
  v-on:input="something = $event.target.value">

3) 컴포넌트와 함께 사용하기

<custom-input
  :value="something"
  @input="value => { something = value }">
</custom-input>

- value prop를 가진다.

- 새로운 값으로 input 이벤트를 내보낸다.

https://jsfiddle.net/chrisvfritz/1oqjojjx/?utm_source=website&utm_medium=embed&utm_campaign=1oqjojjx

*컴포넌트의 v-model 사용자 정의

input의 checkbox나 radio를 위해 model 옵션을 추가해서 사용할것

*비 부모-자식간의 통신

- Vue 인스턴스를 중앙 이벤트 버스로 사용할 수 있다.

1) js

var bus = new Vue(); bus.$emit('id-selected', 1) bus.$on('id-selected', function (id) { // ... })