So I am having an issue with passing down a prop from my parent view to another view, right now I am just testing using a simple variable but it doesn't seem to be picking it up... there are no errors or anything, it is just not displayed on my page.
Here is my parent code:
<template>
<v-app>
<Navbar v-bind:currency="currency"/>
<v-content class="mx-5 my-5" v-bind:currency="currency">
<router-view></router-view>
</v-content>
</v-app>
</template>
<script>
import Navbar from '@/components/Navbar'
export default {
name: 'App',
components: {
Navbar
},
data() {
return {
currency: "$ test"
}
},
};
</script>
And here is the code snippets from my child element:
export default {
name: "Home",
props: ['currency']
}
And where I use the currency:
<div class="text-center green--text font-weight-bold headline">{{ currency }}</div>
Can anyone see anything I have done wrong there as to why this element is not being picked up?
Kind Regards, Josh
It should work fine, I don't see anything wrong with it: Here's a simple working reproduction. Check it with that to make sure there are no differences.
Collected from the Internet
Please contact [email protected] to delete if infringement.
Comments