I’m trying to make a date picker and update some text in the DOM when a new date is selected, but it won’t update at all.

My template

<template>
    <div>
        {{ new Date(date).toLocaleDateString('esp',{ weekday :'short', day:'numeric',month:'short', year:'numeric' }).toLocaleUpperCase() }}
        <v-menu
            ref="menu"
            v-model="menu"
            :close-on-content-click="false"
            :return-value.sync="date"
            transition="scale-transition"
            offset-y
            min-width="auto"
        >
            <template v-slot:activator="{ on, attrs }">
                <v-btn plain v-bind="attrs" v-on="on">
                    hi
                </v-btn>
            </template> 
            <v-date-picker
                v-model="date"
                :first-day-of-week="1"
                no-title
                scrollable
                @click:date="menu = false"
            ></v-date-picker>
        </v-menu>
    </div>
</template>
<script>

export default {
    data() {
        return {
            menu: false,
            // date: "2024-01-01",
            date: (new Date(Date.now() - (new Date()).getTimezoneOffset() * 60000)).toISOString().slice(0, 10),
        };
    },
    methods: {
        // I tried this method with a @change event on the picker but it still wouldn't update
        changeDate(e){
            this.$set(this,'date',e)
            // console.log(this.date)
            // this logs the correct date but it won't update in the DOM
            this.menu = false
        },
    },
}
</script>

This is a component inside a router-view. I don’t know if that could mess with vue’s reactivity. I have it like this:

<template>
    <v-container fluid class="pa-0">
        <v-tabs>
            <v-tab to="/foo">FOO</v-tab>
            <v-tab to="/bar">BAR</v-tab>
        </v-tabs>
    <router-view></router-view>
    </v-container>
</template>

I found this question but I couldn’t find a way to update only text (not the value of an input).

I have everything wrapped inside an <app></app> tag like this answer suggested.

And lastly, I don’t use any library so this answer is of no help to me.