[Vuejs]-Is it possible to query data while rendering and return its result

1👍

You can use your exact same logic here, and just use a function below and pass in the group which applies a filter to the object collection and uses the delayed_till.seconds property to determine the validity check, something like this:

<div v-for="(card, groupIndex) in cards" v-bind:key="card.id">
  <div v-text="groupItemsNotDelayed(cards[groupIndex].group)"> </div>
</div>

Then make your function which performs the filter:

groupItemsNotDelayed(group) {
    return group.filter((item) => item.delayed_till.seconds < Date.now()).length
}

By using Date.now() we can get the current time in UTC Epoch, and compare that against our item.delayed_till.seconds to determine if the delayed period has passed (it would have to be less than the current epoch timestamp).

Then we can just call .length on the filtered items to get the count.

Leave a comment