Saltar al contenido

ejemplo de código de paginación vue

Después de de esta larga búsqueda de información resolvimos esta duda que suelen tener muchos los lectores. Te regalamos la respuesta y nuestro deseo es serte de mucha ayuda.

Ejemplo 1: vuetify de paginación de laravel

<v-pagination
    v-model="pagination.current":length="pagination.total"
    @input="onPageChange"></v-pagination>

Ejemplo 2: paginación en la tabla b en bootstrap vue

newVue(
  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:asyncfetchData()this.items=awaitfetch(`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)))

Ejemplo 3: vuetify de paginación de laravel

exportdefaultdata()return
            users:null,
            pagination:
                current:1,
                total:0,
    methods:getUsers()window.axios.get('/api/users?page='+this.pagination.current).then(response=>this.users= response.data.data;this.pagination.current= response.data.current_page;this.pagination.total= response.data.last_page;);,onPageChange()this.getUsers();,mounted()this.getUsers();

Te mostramos comentarios y puntuaciones

Puedes añadir valor a nuestro contenido informacional asistiendo con tu experiencia en las observaciones.

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *