I am passing 6 routes from a blade file to a Vue component but when I do and output the routes, the 6 routes appear 6 times in groups of 6. Each group of the same 6 routes shows as it's own component in the vue dev tools.
index.blade.php (some of the looping is done in blade)
@foreach (App\Questions::all() as $question)
<question
:questions="{{App\Questions::all()}}"
:user="{{$user}}"
routes="{{route($question->route)}}"> //Passing the 6 question routes
</question>
@endforeach
Questions.vue
<div v-for="question in questions">
<div v-for="route in routes">
<a :href="route">
{{ question.title }}
</a>
</div>
</div>
<script>
export default {
props: ["questions", "user", "routes"];
}
</script>
Why are they showing up as 6 different components, each component with the same information 6 times.
Thank you.