const coinTop50 = { data() { return { date :document.getElementById("startDate").innerText, items: [], } }, mounted() { this.requestData(this.date) const elems = document.querySelectorAll('.datepicker'); M.Datepicker.init(elems, {onClose:()=>{ this.date = this.datepicker.date.toISOString().slice(0,10) }}); }, watch:{ date(newDate,oldDate){ this.requestData(newDate) } }, methods:{ requestData(sDate){ const d = new Date(sDate) const url = `/top50json/${d.getDate()}-${("0"+(d.getMonth()+1)).slice(-2)}-${d.getFullYear()}/`; axios.get(url) .then(this.handleJsonUpdate) }, handleJsonUpdate(response){ this.items = response.data } } } Vue.createApp(coinTop50).mount('#app')