Check if child is a column

src/components/column/Column.vue

@@ -1,5 +1,6 @@
 <script>
 export default {
+    name: 'column',
     props: {
         columnKey: {
             type: Object,

src/components/datatable/DataTable.vue

@@ -2,11 +2,11 @@
     <div class="p-datatable p-component">
         <slot></slot>
         <div class="p-datatable-wrapper">
-            <div class="p-datatable-header" v-if="$slots.header">
+            <div class="p-datatable-header" v-if="$scopedSlots.header">
                 <slot name="header"></slot>
             </div>
             <DTPaginator v-if="paginatorTop" :rows="rows" :first="first" :totalRecords="totalRecordsLength" :pageLinkSize="pageLinkSize" :template="paginatorTemplate" :rowsPerPageOptions="rowsPerPageOptions"
-					:currentPageReportTemplate="currentPageReportTemplate" :class="{'p-paginator-top': paginatorTop}" @page="onPage($event)">
+					:currentPageReportTemplate="currentPageReportTemplate" class="p-paginator-top" @page="onPage($event)" :alwaysShow="alwaysShowPaginator">
                 <template #left v-if="$scopedSlots.paginatorLeft">
                     <slot name="paginatorLeft"></slot>
                 </template>
@@ -39,7 +39,7 @@
                 </tbody>
             </table>
             <DTPaginator v-if="paginatorBottom" :rows="rows" :first="first" :totalRecords="totalRecordsLength" :pageLinkSize="pageLinkSize" :template="paginatorTemplate" :rowsPerPageOptions="rowsPerPageOptions"
-					:currentPageReportTemplate="currentPageReportTemplate" :class="{'p-paginator-bottom': paginatorBottom}" @page="onPage($event)">
+					:currentPageReportTemplate="currentPageReportTemplate" class="p-paginator-bottom" @page="onPage($event)" :alwaysShow="alwaysShowPaginator">
                 <template #left v-if="$scopedSlots.paginatorLeft">
                     <slot name="paginatorLeft"></slot>
                 </template>
@@ -47,7 +47,7 @@
                     <slot name="paginatorRight"></slot>
                 </template>
             </DTPaginator>
-            <div class="p-datatable-footer" v-if="$slots.footer">
+            <div class="p-datatable-footer" v-if="$scopedSlots.footer">
                 <slot name="footer"></slot>
             </div>
         </div>
@@ -162,7 +162,8 @@ export default {
         }
     },
     mounted() {
-        this.columns = [...this.$children];
+        this.columns = this.$children.filter(child =>  child.$options._propKeys.indexOf('columnKey') !== -1);
+       
     },
     methods: {
         getRowKey(rowData, index) {
@@ -212,18 +213,10 @@ export default {
             return (!this.value || this.value.length === 0);
         },
         paginatorTop() {
-            if (this.paginatorPosition && (this.paginatorPosition !== 'bottom' || this.paginatorPosition === 'both')) {
-                return true
-            }
-            else
-                return null;
+            return this.paginator && (this.paginatorPosition !== 'bottom' || this.paginatorPosition === 'both');
         },
         paginatorBottom() {
-            if (this.paginatorPosition && (this.paginatorPosition !== 'top' || this.paginatorPosition === 'both')) {
-                return true
-            }
-            else
-                return null;
+            return this.paginator && (this.paginatorPosition !== 'top' || this.paginatorPosition === 'both');
         }
     },
     components: {

src/components/paginator/Paginator.d.ts

@@ -15,6 +15,7 @@ export declare class Paginator extends Vue {
     rowsPerPageOptions?: any[];
     template?: string;
     currentPageReportTemplate?: any;
+    alwaysShow?: boolean;
     $emit(eventName: 'page', event: PageState): this;
     $slots: {
         left: VNode[];

src/components/paginator/Paginator.vue

@@ -1,5 +1,5 @@
 <template>
-	<div class="p-paginator p-component p-unselectable-text">
+	<div class="p-paginator p-component p-unselectable-text" v-if="alwaysShow ? true : (pageLinks && pageLinks.length > 1)">
         <div class="p-paginator-left-content" v-if="$scopedSlots.left">
             <slot name="left" :state="currentState"></slot>
         </div>
@@ -56,6 +56,10 @@ export default {
         currentPageReportTemplate: {
             type: null,
             default: '({currentPage} of {totalPages})'
+        },
+        alwaysShow: {
+            type: Boolean,
+            default: true
         }
     },
     data() {

src/views/paginator/PaginatorDoc.vue

@@ -95,12 +95,12 @@ onPage(event) {
                 <div class="doc-tablewrapper">
                     <table class="doc-table">
                         <thead>
-                        <tr>
-                            <th>Name</th>
-                            <th>Type</th>
-                            <th>Default</th>
-                            <th>Description</th>
-                        </tr>
+                            <tr>
+                                <th>Name</th>
+                                <th>Type</th>
+                                <th>Default</th>
+                                <th>Description</th>
+                            </tr>
                         </thead>
                         <tbody>
                             <tr>
@@ -145,6 +145,12 @@ onPage(event) {
                                 <td>({currentPage} of {totalPages})</td>
                                 <td>Template of the current page report element.</td>
                             </tr>
+                            <tr>
+                                <td>alwaysShow</td>
+                                <td>boolean</td>
+                                <td>true</td>
+                                <td>Whether to show the paginator even there is only one page.</td>
+                            </tr>
                         </tbody>
                     </table>
                 </div>