Date field

The date field stores a timestamp in milliseconds to represent a date value.

Examples

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

# blocks/Product.vue

<template>
  <div>
    <div v-if="releaseDate">
      <span>Release date:</span>
      <span>{{ new Date(releaseDate).toLocaleDateString() }}</span>
    </div>
    ...
  </div>
</template>

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

defineProps({
  releaseDate: dateField({
    placeholder: 'Select a date',
    required: true,
  }),
})
</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: {
    releaseDate: {
      type: 'date',
      options: {
        placeholder: 'Select a date',
        required: true,
      },
    },
    // ...
  },
})

Options

You can specify the following options in the date field: