vuetifyjs/vuetify · error · Error

Unrecognized pagination target ${pageBy}

Error message

Unrecognized pagination target ${pageBy}

What it means

Thrown by usePaginatedItemsWithGroups() when options.pageBy is none of 'item' | 'group' | 'any'. The switch handles those three literal targets; anything else falls through to a final throw. pageBy controls whether pagination counts raw items, whole groups, or any flat row.

Source

Thrown at packages/vuetify/src/components/VDataTable/composables/paginate.ts:213

      paginatedItems: paginatedItemsWithGroups,
    }
  }

  if (pageBy === 'any') {
    const { flatItems } = group(sortedItems)
    const { paginatedItems: paginatedItemsWithGroups, pageCount, setItemsPerPage, prevPage, nextPage, setPage } = paginate(flatItems)

    return {
      pageCount,
      setItemsPerPage,
      prevPage,
      nextPage,
      setPage,
      paginatedItems: paginatedItemsWithGroups,
    }
  }

  throw new Error(`Unrecognized pagination target ${pageBy}`)
}

View on GitHub (pinned to 8d153908df)

Solutions

1. Set `page-by` (pageBy) to one of 'item', 'group', or 'any'.
2. Omit the prop to use the default rather than passing an invalid string.
3. If the value comes from a variable, narrow its type to `'item' | 'group' | 'any'` so the compiler catches typos.

Example fix

// before
<VDataTable :page-by="'row'" :group-by="groupBy" />

// after
<VDataTable page-by="group" :group-by="groupBy" />
// (only when grouping; otherwise omit it)

type PageBy = 'item' | 'group' | 'any'
function isPageBy(v: unknown): v is PageBy {
  return v === 'item' || v === 'group' || v === 'any'
}
function resolvePageBy(v: unknown): PageBy {
  return isPageBy(v) ? v : 'item'
}

function isPageBy(v: unknown): v is 'item' | 'group' | 'any' {
  return v === 'item' || v === 'group' || v === 'any'
}

When it happens

Trigger: Passing a `pageBy` prop/value other than 'item', 'group', or 'any' (e.g. 'page', 'row', undefined-with-fallback-bug, or a typo like 'items'). Triggered by VDataTable's `page-by` / pageBy option.

Common situations: Typo in the `pageBy` prop, passing an untranslated value from an enum that does not match the union, or a version change where the allowed values were renamed.

Related errors

• ${input} is not a valid timestamp. It must be a Date, number
• foo
• Missing group!
• Missing headers!
• Missing pagination!

AI-assisted analysis of vuetifyjs/vuetify@8d153908df (2026-08-12). Data as JSON: /api/errors/1cac87198fecd6bd. Report an issue: GitHub.