I'm still new to Vue and I need to pass for loop data to a Vue component through Django template, but I don't know exactly how.
In my html page I'm looping a vue component with Django, like this:
{% for employee in object_list %}
<app-card name={{ employee.name }} skills-all={{ employee.skils.all }} skill={{ employee.skils.all.name }}></app-card>
{% endfor %}
Note: skills-all is a list with lists of skills, and I just wanted to loop through all the skills and show all skills names in my html list
And my Vue component looks like this:
<template>
<div id="card">
<h1>{{ name }}</h1>
<ul>
<li v-for="skill in skillsAll">{{ skill }}</li>
</ul>
</div>
</template>
<script>
export default {
props: ["name", "skillsAll", "skill"]
};
</script>
Everything works just fine until I try to make that for loop inside the vue component. Actually I'm very confused about how am I supposed to loop something inside Vue when the data needs to come from outside the component
