props里的属性只被监听（watch）一次问题

子组件

子组件通过show实现是否显示

  name:'menuRef',
  props:{
    visible: {
      type:Boolean,
      default:false,
    },
    onclose:{
      type:Function
    }
  },
  watch:{
    visible:function(val){
      this.show=val;
    }
  },

父组件

父组件通过修改visible来修改子组件的show属性

// template
<menuRef :visible="showMenu"></menuRef>

// script
onSearch:function(value) {
  this.showMenu=true;
},

问题

• 父组件修改visible时，子组件中只监听到一次visible的变化

原因

• 父组件设置this.showMenu=true后this.showMenu的值为true,再次设置this.showMenu=true时visible不会被传递到子组件

解决方法

在子组件中修改父组件的showMenu属性

// 父组件template
<menuRef :visible="showMenu" v-on:onclose="handleClose"></menuRef>
// 父组件sctipt
handleClose:function(){
  this.showMenu=false;
}

// 子组件修改父组件的showMenu属性
this.$emit('onclose');