Vue prop的双向绑定

方法一：v-model

1. 父组件

   // 法一：有缺陷，初始值传不过去
   <Father v-model="message" />
   // 法二：刨根问底
   <Father v-bind:message="message" v-on:input="message = $event">
   // or
   <Father :message="message" @input="message = $event">
   

2. 子组件

   Vue.component('Son', {
     props: ['message'],
     template: `
       <input
         v-bind:value="message"
         v-on:input="$emit('input', $event.target.value)"
       >
     `
   })
   

方法二：sync修饰符

1. 子组件

     this.$emit('update:title', newtitle)

2. 父组件

• 刨根问底

  <text-document
    v-bind:title="doc.title"
    v-on:update:title="doc.title = $event"
  ></text-document>
  

• .sync修饰符

  <text-document v-bind:title.sync="doc.title"></text-document>