In Vue, how do I get the emitted value from a child component and then use it in the parent component's return data?-PHP Chinese Network Q&A

Article Topic Learning Download Q&A Programming Dictionary Game Recent Updates

简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)

In Vue, how do I get the emitted value from a child component and then use it in the parent component's return data?

P粉523625080 2023-12-19 20:43:06

371

How to get the title value passed by the Topbar component and use the value in the data() return part? I tried adding a method to pass the value, but unfortunately, although I was able to console log the value in the parent file, it didn't work. I'm still a beginner in vue js so I'd like some help on this issue. Thanks!

Top bar template

P粉523625080

reply all (1)

P粉6676492532023-12-20 19:41:16 1 floor

Try a code snippet like below (pass all tabs to child and loop there):

const app = Vue.createApp({ data() { return { title:'', tabs: [ {link:'', name: "Sec 1", dropdown: false, dropdownTabs:[]}, {link:'', name: "Sec 2", dropdown: false, dropdownTabs:[]} ] } }, methods: { getTabTitle(title) { console.log(title) this.title =title } } }) app.component('topbar', { template: `   
 `, props: ['tabs'], methods: { send(title) { this.$emit('passData', title) } } }) app.mount('#demo')