1. 程式人生 > >Vue父子組件和非父子組件傳值問題

Vue父子組件和非父子組件傳值問題

clas close fault lse 商城 .proto type IT ont

父組件跟子組件之間的傳值(具體參考lonzhubb商城)

1、父組件傳值給子組件形式,ifshop是要傳的對象,右邊ifshop代表要傳的這個對象的數據

<v-select :ifshop="ifshop" :clickType="clickType" @close="close" @addShop="sureAddShop"></v-select>

2、子組件接收父組件的數據用props

props: {

ifshop:{
type:Boolean,
default (){
return false
}
}

}

3、子組件調用父組件

methods: {
close:function(){
this.$emit(‘close‘);
},

非父組件跟子組件之間的傳值

之間值

在main.js建一個空的Vue實例

//購物車組件信息交互
Vue.prototype.shopbus = new Vue();

在組件A中傳遞參數

this.shopbus.$emit(‘goodsCount‘,this.myCount) 在組件B中接收參數

this.shopbus.$on(‘goodsCount‘, (myCount) => {}

Vue父子組件和非父子組件傳值問題