vue2.0+ 使用v-model 及報錯解決辦法;
阿新 • • 發佈:2019-01-23
var childVue = {
template:"<div><div>{{ msg }}</div><button @click=\"changeFater\">改變父元件值</button></div>",
data(){
return {
message:this.msg // 劃重點 不定義這個屬性會有報錯;
}
},
props:{
msg:0 //父子間傳遞資料
},
model:{
prop:"msg",//父子間傳遞資料的屬性名稱
event:"msgEvent"//定義傳遞資料到父元件的事件名稱
},
methods:{
changeFater(){
this.message = this.msg;// 將資料同步
this.$emit("msgEvent",this.message+=2)// 將同步好的資料傳遞到父元件
}
}
}
var vue = new Vue({
el:"#app",
data:{
test:0
},
methods:{
changChild(){
this.test+=1
}
},
components:{
childVue
}
})