How to limit element in object Javascript

Question

<div
    v-for="(item, key) in daySchedule"
    :key="key"
    class="date">
    
  </div>

current : i have 3 object daySchedule

expected : i want to limit to 2 object daySchedule

Does this answer your question? [How to limit iteration of elements in \`v-for\`](https://stackoverflow.com/questions/46622209/how-to-limit-iteration-of-elements-in-v-for) — FoundingBox, Jan 07 '21 at 03:48
You can make the compute suggested in the above question into a `computed` and reference it like `v-for="(item, key) in computedSchedule"`. Btw, do not use the `key` for `:key` here. It is counter-productive and does the opposite of what it is supposed to do. Try to pass it some unique identifier. — kissu, Jan 07 '21 at 08:44

score 0 · Answer 1 · answered Jan 08 '21 at 06:43

I get item and index from daySchedule data. I set index as key. I set as less than 2 because index started from 0. I hope I made myself clear. This code give to you 2 object

<div v-for="(item, index) in daySchedule" :key="index" class="date">
      <div v-if="index < 2 ">
        {{item.date}}
      </div>
 </div>

My example data is here :

    data: function () {
    return {
      daySchedule: [{
        id:"1",
        date:"2021",
      },
      {
        id:"2",
        date:"2020",
      },
      {
        id:"3",
        date:"2019",
      }],
    };
  },

How to limit element in object Javascript

1 Answers1