PageNav.vue

<template>
 <component:is="tag":class="className"@click="wave">
 <av-if="prev"class="page-link"href="#"aria-label="Previous">
 <spanaria-hidden="true">&laquo;</span>
 <spanclass="sr-only">Previous</span>
 </a>
 <av-if="next"class="page-link"href="#"aria-label="Next">
 <spanaria-hidden="true">&raquo;</span>
 <spanclass="sr-only">Next</span>
 </a>
 </component>
</template>

<script>
importwavesfrom'../../mixins/waves';

constPageNav= {
 props: {
 tag: {
 type:String,
 default:"li"
 },
 active: {
 type:Boolean,
 default:false
 },
 disabled: {
 type:Boolean,
 default:false
 },
 href: {
 type:String
 },
 waves: {
 type:Boolean,
 default:true
 },
 prev: {
 type:Boolean,
 default:false
 },
 next: {
 type:Boolean,
 default:false
 }
 },
 computed: {
className() {
return [
'page-item',
this.active?'active':false,
this.disabled?'disabled':false,
this.waves?'ripple-parent':false
 ];
 }
 },
 mixins: [waves]
};

exportdefaultPageNav;
export { PageNavasmdbPageNav };
</script>

<style scoped>
</style>