频道列表模块 (二) 03-点击进入频道-sync修饰符 语法糖 ——子父组件同步数据，补充v-model使用

点击进入频道-sync修饰符 语法糖 ——子父组件同步数据，补充v-model使用

src/views/home/components/channel-edit.vue中：

<span class="f12" @click="enterChannel(i)" 

    // 进入频道 index 是你需要进入频道索引
    enterChannel (index) {
      // 关闭  编辑频道组件
      this.$emit('input', false)
      // 通知  父组件  修改activeIndex的值 为当前传入index
      this.$emit('update:activeIndex', index)
    },

 //  修改组件索引代码 
<edit-channel
      v-model="showEditChannel"
      :channels="channels"
      @update="activeIndex=$event"
      :activeIndex="activeIndex">
    </edit-channel>

可以简写：sync修饰符 语法糖 ——子父组件同步数据，补充v-model使用

    enterChannel (index) {
      this.$emit('input', false)
-     this.$emit('update', index)
+     this.$emit('update:activeIndex', index)
    },

    //以下等效  
    //频道编辑
   <edit-channel
      v-model="showEditChannel"
      :channels="channels"
-      @update="activeIndex=$event"
-      :activeIndex="activeIndex">
+      :activeIndex.sync="activeIndex">
    </edit-channel>