InertiaJs: Props undefined I'm passing data to my component <Dashboard compo="Developer"> from my component Developer but im getting undefined in Dashboard
Developer.vue
<script setup>
import Dashboar from '@/Pages/Dashboard.vue';
</script>
<template>
<Dashboard compo="Developer">
<!--Some Html-->
</Dashboard>
</template>
Dashbard.vue
<script setup>
defineProps({
compo: String
});
</script>
<template>
<h1>{{ compo }}</h1> <!--getting undefined-->
</template>
How can I solve this?
You have almost got it…
<script setup>
let props = defineProps({
compo: String
});
</script>
<template>
<h1>{{ compo }}</h1>
</template>
You need the props.compo within the script only
@tykus It dosnt work either. I know its a pretty simple and I did it several times without inertia but for some reason is not working
Try to remove the space arround the equal sign on your Dashboard tag.
And on your Dashboard component, you don't need the props variable. Just remove it.
<script setup>
defineProps({
compo: String
});
</script>
<template>
<h1>{{ compo }}</h1>
</template>
@felloz Ok. Have you checked to make sure you didn't type something wrong? Sometimes, rewrite a bit of code can help.
Why are you trying to send the component as a prop that way.
Use slots instead, or pass the component name but import it inside the parent component that will be using it.
You can delete this question.
The fool me was making the changes in a component hoping to see the results in another that had nothing to do with it. It took me almost an hour to figure it out.
Please sign in or create an account to participate in this conversation.