title: Disable default pagination in Vuetify Data table?
body: <p>I am working with the Vuetify Data table and it seems like by default, the table sorts everything according to name. How can i Disable that? I am not even using any pagination. I want the data to render in the order it is.</p>
  
  <p>Check out this simple <a href="https://codepen.io/treehuggerrick/pen/oNjyWrv?editors=1010" rel="nofollow noreferrer">Codepen</a>.</p>
  
  <p>Here is a simple working demo:-</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>new Vue({
    el: "#app",
    data: () =&gt; ({
      selected: [],
      headers: [{
          text: "Dessert (100g serving)",
          align: "left",
          value: "name"
        },
        {
          text: "Calories",
          value: "calories"
        },
        {
          text: "Fat (g)",
          value: "fat"
        }
      ],
      desserts: [{
          name: "Frozen Yogurt",
          calories: 159,
          fat: 6.0
        },
        {
          name: "Ice cream sandwich",
          calories: 237,
          fat: 9.0
        },
        {
          name: "Eclair",
          calories: 262,
          fat: 16.0
        }
      ]
    })
  });</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"&gt;&lt;/script&gt;
  &lt;script src="https://cdn.jsdelivr.net/npm/vuetify@1.5.14/dist/vuetify.min.js"&gt;&lt;/script&gt;
  &lt;link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"&gt;
  &lt;link href="https://cdn.jsdelivr.net/npm/vuetify@1.5.14/dist/vuetify.min.css" rel="stylesheet" /&gt;
  
  &lt;div id="app"&gt;
    &lt;v-app id="inspire"&gt;
      &lt;v-data-table v-model="selected" :headers="headers" :items="desserts" select-all item-key="name" class="elevation-1"&gt;
        &lt;template v-slot:headers="props"&gt;
          &lt;tr&gt;
            &lt;th&gt;
              &lt;v-checkbox :input-value="props.all" :indeterminate="props.indeterminate" primary hide-details&gt;&lt;/v-checkbox&gt;
            &lt;/th&gt;
            &lt;th v-for="header in props.headers" :key="header.text"&gt;
              &lt;v-icon small&gt;arrow_upward&lt;/v-icon&gt;
              {{ header.text }}
            &lt;/th&gt;
          &lt;/tr&gt;
        &lt;/template&gt;
        &lt;template v-slot:items="props"&gt;
          &lt;tr :active="props.selected" @click="props.selected = !props.selected"&gt;
            &lt;td&gt;
              &lt;v-checkbox :input-value="props.selected" primary hide-details&gt;&lt;/v-checkbox&gt;
            &lt;/td&gt;
            &lt;td class="text-xs-center"&gt;{{ props.item.name }}&lt;/td&gt;
            &lt;td class="text-xs-center"&gt;{{ props.item.calories }}&lt;/td&gt;
            &lt;td class="text-xs-center"&gt;{{ props.item.fat }}&lt;/td&gt;
          &lt;/tr&gt;
        &lt;/template&gt;
      &lt;/v-data-table&gt;
    &lt;/v-app&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>Any help will be appreciated. Thank you.</p>