.sync修饰符及MVVM

.sync修饰符

父组件

<file-resource :show-me.sync="fileShow"/>  
// 向子组件传一个showMe
<file-resource :show-me="fileShow" />
@update:showMe="fileShow=$event"/>
data () {
    return {
      fileShow: false
    }
}

子组件

export default {
  props: {
    showMe: {
      type: Boolean,
      default: false
      }
    }
 }
methods: {
    fileResourceEnsure () {
      this.$emit('update:showMe', false)
// 子组件通过@update:showMe事件将事件传给父组件，父组件用￥event接收
    }
}

vue的数据响应式

image.png