1 回答

TA貢獻1883條經驗 獲得超3個贊
模擬父子組件通信,通過點擊子組件下一步按鈕觸發next方法,然后通過this.$emit('childEvent', '我是給父組件的禮物')觸發父類的parentMethod方法。
這是父組件:parent.vue:
<template>
<div class="parent">
<v-button @childEvent='parentMethod' />
</div>
</template>
<script>
import VButton from './v-button'
export default {
data () {
return {
title: '父子組件通信'
}
},
methods: {
parentMethod (msg) {
console.log(msg) // 有沒有收到來自子組件的禮物
}
},
components: {
VButton
}
}
</script>
子組件:v-button.vue
<template>
<div class="next" @click='next'>
下一步
</div>
</template>
<script>
export default {
methods: {
next () {
this.$emit('childEvent', '我是給父組件的禮物')
}
}
}
</script>
或者用vuex,時間不早了,已是凌晨1點,我還有好幾個邀請!vuex請參考我github的一個基于 vue2 + vuex + mint-ui的項目吧!不懂得私信我或者評論都可以!
基于 vue2 + vuex + mint-ui 構建一個單頁面應用
添加回答
舉報