You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
{{ message }}
This repository was archived by the owner on Jan 23, 2023. It is now read-only.
<ul><liv-for="post in laravelData.data" v-text="post.title"></li></ul><pagination:data="laravelData" v-bind:showDisabled="true" icon="chevron" v-on:change-page="getResults"></pagination>
Vue.component('example-component',{data(){return{// Our data object that holds the Laravel paginator datalaravelData: {},}},created(){// Fetch initial resultsthis.getResults();},methods: {// Our method to GET results from a Laravel endpointgetResults(page){if(typeofpage==='undefined'){page=1;}// Using vue-resource as an examplethis.$http.get('example/results?page='+page).then(response=>{returnresponse.json();}).then(data=>{this.laravelData=data;});}}});
✅ 📖 Props
Name
Type
Description
data
Object
An object containing the structure of a Laravel paginator response. See below for default value.
limit
Number
(optional) Limit of pages to be rendered. Default 0 (unlimited links) -1 will hide numeric pages and leave only arrow navigation. 3 will show 3 previous and 3 next numeric pages from current page.
showDisabled
Boolean
(optional) If set to true, will display left and right icons always.
icon
String
(optional) Default is angle double; Refer Semantic-UI Icons for specifying which icons you want.