Skip to content

Tag: v-for

Vuejs : how to bind class within a v-for loop

In Vuejs3, I’m looping over an array of objects : I want to add the class ‘border-b-2’ only to the line selected line, but I don’t see how to do that dynamically. When I now set isSelected to true in the vue devtools, all lines get that style applied. As a workaround, what I now do is wrapping this code

Generate multiple select inputs with v-for

I am desperately trying to generate multiple select inputs for a given JSON from an Backend but I cant make it work. The JSON response I am getting looks smth like this: Ive already tried several ways and my last attempt looks like this: Template: Script: I am also not super happy with the JSON struct I am getting. The

Infinite repeated while using v-for in vuejs

I have an API to get list of books, in each book I have author ID. I also want to get author name from that ID through another API (get author), so I use v-for to get items in list of book. Each item I call getAuthor(authorId) function but it repeats infinitely. Does anyone know what the reason is? My

using V-for loop with filtered data set

I am filling values in a table using the code below in my ‘castData’ I have 15 items but I only want to return the ones that include “Sinto” Is there a way of applying this filter. I’ve tried appending .includes(“Sinto”) after the first castData with no luck. Answer One way would be to manipulate your castData before you pass

How to v-for checked value

I’m trying to create a checkbox select only one. My JS looks like the following: This is the old result. I’m trying to get results like this. I can do this by not the v-for method, but I want to do it this way. Because I have a lot of data, How can I checked value in v-for? Here is