fix(QTable): Only set length of rows if greater than the new length quasarframework#5816, quasarframework#5814 (quasarframework#5818)

Author: pdanpdan

ui/dev/components/components/data-table-part2.vue

@@ -109,6 +109,7 @@
       :columns="columns"
       :filter="filter"
       :visible-columns="visibleColumns"
+      no-data-label="I didn't find anything for you"
       row-key="name"
       color="primary"
     >
@@ -146,6 +147,15 @@
           </q-menu>
         </q-btn>
       </template>
+
+      <template v-slot:no-data="props">
+        <q-banner class="full-width bg-warning">
+          <template v-slot:avatar>
+            <q-icon :name="props.icon" color="primary" />
+          </template>
+          {{ props.message }}
+        </q-banner>
+      </template>
     </q-table>
 
     <h4>Custom header/body</h4>

ui/src/components/table/QTable.js

@@ -167,7 +167,9 @@ export default Vue.extend({
 
       if (rowsPerPage !== 0) {
         if (this.firstRowIndex === 0 && this.data !== rows) {
-          rows.length = this.lastRowIndex
+          if (rows.length > this.lastRowIndex) {
+            rows.length = this.lastRowIndex
+          }
         }
         else {
           rows = rows.slice(this.firstRowIndex, this.lastRowIndex)