1. Was ist Synchronisierung?
sync kann zum Übertragen von Daten von untergeordneten Komponenten zu übergeordneten Komponenten verwendet werden, was eine praktische Syntax-Zuckerfunktion darstellt.
2. Implementierungsprozess
2.1 Übergeordnete Komponente (index.vue)
Schlüsselwort zur übergeordneten Komponente hinzufügen: sync
<div @click="dialogVisible = true"></div>
<detail-dialog
:visible.sync="dialogVisible"
>
</detail-dialog>
data(){
return {
dialogVisible:false,
},
}
2.2 Unterkomponente (DetailDialog.vue)
Die Unterkomponente verwendet this.$emit("update: field name", val) für das zu ändernde Wertfeld.
<el-dialog
:visable="dialogVisible"
before-close="close"
></el-dialog>
props:{
dialogVisible:{
type:Boolean,
defaule:false,
},
}
methods:{
close(){
this.$emit("update:dialogVisible",false);
},
}