vue父組件向子組件傳遞數(shù)據(jù), vue的父組件如何將數(shù)據(jù)傳遞給子組件?不知道小伙伴們今天來看看邊肖的分享吧!
vue的父組件向子組件傳遞數(shù)據(jù)有四種方法:props和event,ref,provide和inject,vuex。
1, props and events
父組件將道具數(shù)據(jù)傳遞給子組件,子組件通過觸發(fā)事件將數(shù)據(jù)返回給父組件。代碼如下:
//子組件
template
div @click=changeName(YYY){{name}}/div
/template
script
export default{
props:[name],//or props:{name:{type:String,default:}}
methods:{
//不能在子組件中修改props數(shù)據(jù),但應該為父組件觸發(fā)一個事件來處理。
changeName(newName){
this.$emit(changeName,newName)
}
}
}
/script
//父組件
template
div
child-comp :name=name @changeName=changeName/child-comp
/div
/template
script
import childComp from path
export default{
data(){
return {name:XXX}
},
components:{
childComp
},
methods:{
changeName(newName){
this.name=newName;
}
}
}
/scritp
vue父組件向子組件傳遞數(shù)據(jù),以上就是本文為您收集整理的vue父組件向子組件傳遞數(shù)據(jù)最新內(nèi)容,希望能幫到您!更多相關(guān)內(nèi)容歡迎關(guān)注。