I have developed a custom DateField component. It is functioning properly but I am encountering an error message stating Avoid mutating the prop 'value'. This error occurs when I close the menu by clicking the Cancel button or by clicking outside the menu.
Below is the code snippet -
<template>
<v-menu
:close-on-content-click="false"
:return-value.sync="value"
max-width="290px"
min-width="290px"
offset-y
ref="menu"
transition="scale-transition"
v-model="menu"
>
<template v-slot:activator="{ on }">
<v-text-field
:label="label"
:placeholder="placeholder"
:value="value"
@input="$emit('input', $event)"
v-on="on"
:hint="hint"
/>
</template>
<v-date-picker
:value="dateValue"
@change="$emit('input', $event)"
no-title
scrollable
:type="type"
>
<v-spacer/>
<v-btn @click="menu = false" color="primary" text>Cancel</v-btn>
<v-btn @click="$refs.menu.save(value)" color="primary" text>OK</v-btn>
</v-date-picker>
</v-menu>
</template>