[Vuejs]-Vue Component Cannot Find Prop

by

2👍

✅

For the first part you need to define a prop in header.vue component like so:

props: {
    'propname': { type: Object }
}

and then pass the chx object that you created in parent component:

<custom-header :propname="chx"></custom-header>

now you can access the parent’s data in child component like this:

{{ propname.dates.startFormatted }}

For the second part of the question, you need to fire an event to notify the parent component to update the settingsVisible. You can tackle that this way:

<i v-on:click="toggleSettings()" id="settings" class="..."></i>
//
//
methods: {
    toggleSettings() { this.$emit('toggle'); }
}

and in parent component listen for toggle event:

<custom-header :propname="chx" v-on:toggle="chx.settingsVisible = !chxsettingsVisible"></custom-header>

You can get more information by reading this document page.

Happy coding!

👤ironcladgeek

Leave a comment