[Vuejs]-VueJS v-for loop breaks when referencing other ID

2👍

Looking at your data – I see that you don’t have studyId field for the last item in sessions.
I believe it causes the problem and you should handle it somehow, for example:

{{ studies[(session.studyId || 0)] }} <br />

or

<div v-for="session in sessions">
    <template v-if="!!session.studyId">
        {{ studies[(session.studyId)] }} <br />
        {{ session.interviewee }}
    </template>
</div>

or create a computed property validSessions in you component, where you can filter out empty sessions and then use it in you template like this:

<div v-for="session in validSessions">
   ...
</div>
👤Bsalex

Leave a comment