queryCollection

Usage

Use the auto-imported queryCollection to find contents inside a collection.Here we assume that you havr defined docs collection inside content.config.ts.

<script>
const route = useRoute()
const { data: page } = await useAsyncData(route.path, () => {
  return queryCollection('docs').path(route.path).first()
})
</script>

API

Type

function queryCollection<T extends keyof Collections>(collection: T): CollectionQueryBuilder<Collections[T]>

queryCollection(collection: CollectionName)

Create a query builder to search in the specific collection.

• Parameters:
• • collection: The key of defined collection in content.config.ts

path(path: string)

Search for contents that have specific path. (path is an special field in page collections which generates based on fs path and can be use as route to render the content)

• Patameter:
• • path: The path string to match.

const route = useRoute()
const { data } = await useAsyncData(route.path, () => {
  return queryCollection('docs').path(rotue.path).first()
})

select(...fields: keyof Collection)

Select specific fields from the collection to be returned in the query result.

• Parameters:
  • ...fields: A list of field names to select from the collection.

const route = useRoute()
const { data } = await useAsyncData(route.path, () => {
  return queryCollection('docs')
    .select('path', 'title', 'description')
    .first()
})

order(field: keyof Collection, direction: 'ASC' | DESC)

Order the query results based on a specific field.

• Parameters:
  • field: The field to order by.
  • direction: The direction of ordering, either 'ASC' for ascending or 'DESC' for descending.

const route = useRoute()
const { data } = await useAsyncData(route.path, () => {
  return queryCollection('docs')
    .order('date', 'DESC')
    .all()
})

limit(limit: number)

Limit the number of results returned by the query.

• Parameter:
  • limit: The maximum number of results to return.

const route = useRoute()
const { data } = await useAsyncData(route.path, () => {
  return queryCollection('docs')
    .limit(10)
    .all()
})

skip(skip: number)

skip(skip: number)

Skip a specified number of results in the query.

• Parameter:
  • skip: The number of results to skip.

const route = useRoute()
const { data } = await useAsyncData(route.path, () => {
  return queryCollection('docs')
    // Skip first 5 items
    .skip(5)
    .all()
})

where(field: keyof Colleciton, operator: SqlOperator, value?: unkown)

Add a condition to the query to filter results based on a specific field.

• Parameters:
  • field: The field to filter on.
  • operator: The SQL operator to use for comparison. Possible values include:
    • '=': Equal to
    • '>': Greater than
    • '<': Less than
    • '<>': Not equal to
    • 'in': In a list of values
    • 'BETWEEN': Between two values
    • 'NOT BETWEEN': Not between two values
    • 'IS NULL': Is null
    • 'IS NOT NULL': Is not null
    • 'LIKE': Matches a pattern
    • 'NOT LIKE': Does not match a pattern
  • value: The value to compare against. The type depends on the operator used.

const route = useRoute()
const { data } = await useAsyncData(route.path, () => {
  return queryCollection('docs')
    .where('date', '<', '2024-04-04')
    .all()
})

all()

Execute the query and return all matching results.

• Returns: A Promise that resolves to an array of all matching documents.

const route = useRoute()
const { data } = await useAsyncData(route.path, () => {
  return queryCollection('docs').all()
})

first()

Execute the query and return the first matching result.

• Returns: A Promise that resolves to the first matching document, or null if no documents match.

const route = useRoute()
const { data } = await useAsyncData(route.path, () => {
  return queryCollection('docs').first()
})

Examples

Here is a complete example of how to fetch list of documents in docs collections.

<script setup lang="ts">
const { data: docs } = await useAsyncData('documents-list', () => {
  return queryCollection('docs')
    .order('date', 'DESC')
    .select('title', 'path', 'description')
    .all()
})
</script>

<template>
  <NuxtLink v-for="doc in docs" :key="doc.path" :to="doc.path">
    <h2>{{ doc.title }}</div>
    <p>{{ doc.description }}</p>
  </NuxtLink>
</template>