v-page

Простая панель пагинации, включающая меню длины и поддержку локализации, основанная на Vue2.

jQuery версия: bPage

Коллекция плагинов Vue| Плагин | Статус | Описание |

| :---------------- | :-- | :-- | | v-page | | Простая панель пагинации, включающая меню длины и поддержку локализации | | v-dialogs | | Простой и мощный диалог, включающий режимы модального окна, уведомления, маскировки и тоста | | v-tablegrid | | Проще используемый и практичный компонент таблицы данных | | v-uploader | | Плагин Vue2 для упрощённого и более удобного загрузки файлов,
вы можете перетаскивать файлы или выбирать файлы через диалоговое окно для загрузки | | v-ztree | | Простое дерево для Vue2, поддерживающее выбор одного или нескольких узлов с помощью флажков,
а также поддержка данных серверной части | | v-gallery | | Плагин Vue2 для просмотра изображений в галерее | | v-region | | Простой селектор региона, предоставляющий данные административного деления Китая | | v-selectpage | |npm version](https://www.npmjs.com/package/v-selectpage) | Мощный селектор для Vue2, представление списка или таблицы с пагинацией,
поддержка множественного выбора с помощью тегов, локализация и поддержка серверных ресурсов |

| v-suggest | | Vue2 плагин для автозаполнения ввода |

| v-playback | | Vue2 плагин для упрощения воспроизведения видео |

| v-selectmenu | | Простое, удобное и высоконастраиваемое решение для меню |

Установка

npm install v-page --save

Добавьте плагин в ваш файл main.js.

import Vue from 'vue'
import vPage from 'v-page';

Vue.use(vPage, { глобальные конфигурационные опции... });

Использование на странице

Шаблонный код

<template>
  <v-page :total-row="totalRow" @page-change="pageChange"></v-page>
</template>

Код скрипта

export default {
  data() {
    return {
      totalRow: 0 // обязательный параметр
    };
  },
  methods: {
    // Получение обратного вызова изменения информации страницы
    pageChange(pInfo) {
      console.log(pInfo); //{pageNumber: 1, pageSize: 10}
    }
  }
};