0

Estoy tratando de agregar paginador a mi lista en vue js pero no consigo relacionarla al contenido.

new Vue({
  el: "#app",
  data: () => ({
    rows: 100,/*campo para paginacion*/
    perPage: 3,/*campo para paginacion*/
    currentPage: 1,/*campo para paginacion*/
    tipoCambio: 0,
    monedaSeleccionada: "",
    monedas: [DOLAR, SOL],
    cuotasDePagoEditado: [],

La paginación no aplica al contenido de la lista

1
  • Por favor incluye todo el codigo de tu componente, incluyendo la template, los metodos, las computed, ect. Imagino que estas usando vue como libreria ya que montas vue directamente sobre el nodo #app, aun asi seria util ver como traes y manipulas la data, saludos. Commented el 24 dic. 2020 a las 11:49

1 respuesta 1

0

Este es un ejemplo simple de paginación, quizás te puede servir, en vista de que no colocaste código.

<li v-for="(user, index) in users" v-show="(pag - 1) * NUM_RESULTS <= index  && pag * NUM_RESULTS > index">
    {{ user.name }} - {{ user.email }}
</li>


<li>
   <a href="#" aria-label="Previous" v-show="pag != 1" @click.prevent="pag -= 1">
      <span aria-hidden="true">Anterior</span>
   </a>
</li>
<li>
   <a href="#" aria-label="Next" v-show="pag * NUM_RESULTS / users.length < 1" @click.prevent="pag += 1">
      <span aria-hidden="true">Siguiente</span>
    </a>
</li>

dentro del Vue()

data: {
    NUM_RESULTS: 3, // Numero de resultados por página
    pag: 1, // Página inicial
    // JSON a mostrar
    users: [{
             "id": 1,
             "name": "Leanne Graham",
             "email": "[email protected]"
            },
            {
              "id": 2,
              "name": "Ervin Howell",
              "email": "[email protected]"
            }]
}
1
  • 1
    El OP tiene un problema y no le dices como resolverlo.
    – Candid Moe
    Commented el 12 oct. 2021 a las 6:59

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.