Skip to main content

onchange

Description​

Fires when a new date is selected in a calendar

Usage​

onchange?: (ev: { value: Date | null }) => void;

Parameters​

  • value - (required) an object with the newly selected value of the calendar or null if the value is cleared

Example​

<script setup>
  import { Calendar } from "@svar-ui/vue-core";

  function handleChange(ev){
       const newValue = ev;
       console.log(newValue);
       // =>{value: Thu Apr 20 2023 00:00:00 GMT+0300}
  }
</script>

<template>
  <Calendar :value="new Date(2022, 2, 18)" :onchange="handleChange"/>
</template>

Details​

The handler function receives an object with the newly selected value of the calendar or null if the value is cleared.

Related article: Catching the change of the selected date