ショップ

企業向け

v-pagination コンポーネントは、ユーザーが情報を簡単に消費できるように、長いデータセットを分割するために使用されます。 指定された長さに応じて、ページネーションコンポーネントは自動的にスケーリングされます。 現在のページを維持するには、単に v-model 属性を指定します。

デフォルトのページネーションは、設定された length プロップに基づいてページ数を表示し、ナビゲートしやすいように prev ボタンと next ボタンで囲んでいます。

確認したいコンポーネントを下から選び、利用できる props、slots、events、functions を確認してください。

以下に、簡単な例から複雑な例まで示します。

Using the length prop you can set the length of v-pagination, if the number of page buttons exceeds the parent container, it will truncate the list.

You can also manually set the maximum number of visible page buttons with the total-visible prop.

The circle prop gives you an alternate style for pagination buttons.

Previous and next page icons can be customized with the prev-icon and next-icon props.

Pagination items can be manually deactivated using the disabled prop.

準備はいいですか? 以下から続きが読めます。

Caught a mistake or want to contribute to the documentation? Edit Layout on GitHub!