Link field

The link field stores links to page-like collections or external links.

Examples

Here's an example of using the link field in a block:

# blocks/Logo.vue

<template>
  <NuxtLink :to="homepageLink">
    ...
  </NuxtLink>
</template>

<script lang="ts" setup>
import { linkField } from '#pruvious'

defineProps({
  homepageLink: linkField({
    required: true,
    placeholder: 'Select a page',
  }),
})
</script>

Here is another example of how to use it in a collection definition:

# collections/products.ts

import { defineCollection } from '#pruvious'

export default defineCollection({
  name: 'products',
  mode: 'multi',
  fields: {
    relatedProduct: {
      type: 'link',
      options: {
        required: true,
        placeholder: 'Select a page',
      },
    },
    // ...
  },
})

Options

You can specify the following options in the link field: