.sync modifier

.: Value.syc and this $ emit ( 'update: value', val); together

. V-model = "showAlarm" and this $ emit ( 'update: value', val); a group

<history-alarm-dialog  v-if="showAlarm" :value.sync="showAlarm"></history-alarm-dialog> 

<el-dialog v-dialog-drag :modal="false" :visible.sync="dialogVisible" title="历史事件" width="1200px">

props: {
  value: Boolean
},
data: function(){
},
computed: {
dialogVisible: {
        get: function() {
            return this.value;
         },
        set: function(val) {
              this.$emit('update:value', val);
       }
}
},

 

 

<history-alarm-dialog  v-if="showAlarm" v-model="showAlarm"></history-alarm-dialog>


dialogVisible: {
         get: function() {
                    return this.value;
         },
         set: function(val) {
         this.$emit('input', val);
                 //this.$emit('update:value', val);
           }
 }

 

V- Model input within different elements use different properties and throw different events: 

text and textarea element and attribute value using an input event; 
CheckBox use of radio and checked property and change events;
 SELECT field value as a prop and change as an event.