/Javascript/Vue/Pagination in b table in bootstrap vue

Pagination in b table in bootstrap vue

new Vue({
  el: '#app',
  data() {
    return {
      items: [],
      fields: [{
          key: 'postId',
          label: 'Post ID'
        },
        {
          key: 'id',
          label: 'ID'
        },
        {
          key: 'name',
          label: 'Name'
        },
        {
          key: 'email',
          label: 'Email'
        },
        {
          key: 'body',
          label: 'Body'
        }
      ],
      currentPage: 0,
      perPage: 10,
      totalItems: 0
    }
  },
  mounted() {
    this.fetchData().catch(error => {
      console.error(error)
    })
  },
  methods: {
    async fetchData() {
      this.items = await fetch(`https://jsonplaceholder.typicode.com/comments?_page=${this.currentPage}&_limit=${this.perPage}`)
        .then(res => {
          this.totalItems = parseInt(res.headers.get('x-total-count'), 10)

          return res.json()
        })
        .then(items => items)
    }
  },
  watch: {
    currentPage: {
      handler: function(value) {
        this.fetchData().catch(error => {
          console.error(error)
        })
      }
    }
  }
})

Source: stackoverflow.com

Similar codes

0 vote123 views1 answer
How to pass methods in vue js
Javascript Vue
16 votes242 views5 answers
Vuejs router params
Javascript Vue
28 votes240 views4 answers
Vue inline style bind
Javascript Vue
0 vote110 views2 answers
Scroll to top router link vue
Javascript Vue
0 vote113 views2 answers
Vue config devtools
Javascript Vue
0 vote126 views1 answer
Watching Arrays and Objects (Vue 3)
Javascript Vue
0 vote113 views1 answer
Vue.js watch event
Javascript Vue
4 votes114 views2 answers
Router link active in vue.js
Javascript Vue
1 vote117 views2 answers
For i in range vue js
Javascript Vue
0 vote70 views1 answer
Vue block other script event listeners
Javascript Vue