I'm using the vcalendar for my vue-app. So far it works ok but when I try to add some attributes, they don't apply
here is my code:
<v-calendar :attributes="attributes" :available-dates="availableDates" @dayclick="dayClicked" />
then I do this:
computed: {
attributes() {
return this.availableDates.map((date) => ({
dot: {
backgroundColor: '#FF0000',
},
}))
},
}
but nothing happens and I don't know why. Can someone maybe help me out?
I'm assuming you're trying to add a dot under all available dates in v-calendar.
attributes does not need to be computed. It should just be a data property that refers to availableDates (not mapped from it):
export default {
data() {
const availableDates = [ new Date() ]
return {
availableDates,
attributes: [
{
dot: true,
dates: availableDates,
},
],
}
},
}
Since attributes.dates refers to availableDates, any changes to availableDates is automatically reflected in the attributes binding.