0

I am trying to slice an array of items in Vue here is my code

<template>
    <div v-for="item in Items" :item="item" :key="item.id">{{ item.name }}</div>
</template>

<page-query>
  query {
    count
    items {
       id
       name
    }
  }
</page-query>

<script>
    export default {
        props: {
          items: Array,
        }
        computed: {
          Items() {
            return this.items.slice(0, 4);
          },
        }
    }
</script>

As you can see I am slicing the array by 4. In my API data I have a "count" object that returns a number I need to use to slice the items but I cant figure out a way how. Could you please give me a hint how to use count data instead of hardcoded number 4?

hgb123
  • 13,869
  • 3
  • 20
  • 38
Ali Seivani
  • 496
  • 3
  • 21

1 Answers1

0

Using limit should help you

<page-query>
  query {
    count
    items(limit: 4) {
       id
       name
    }
  }
</page-query>
hgb123
  • 13,869
  • 3
  • 20
  • 38
  • Thank you for answer but limit is a hardcoded number again. I am trying to dynamically slice. In my query I have "count" that returns a number. I need to use this number to slice or limit the array. – Ali Seivani Nov 07 '20 at 13:05