I am attempting to assign a data variable within a watch handler function for an input field in a VueJs Component. The code snippet is as follows:
data() {
return {
params: {
// default params to 1 month
from: new Date().setMonth(new Date().getMonth() - 1),
to: Date.now(),
skip: 0,
limit: 100
}
}
}
watch: {
dates: {
handler: date => {
console.log(this.params)
if (date.start) {
this.params.from = moment(date.start, "YYYY/MM/DD")
}
if (date.end) {
this.params.to = moment(date.end, "YYYY/MM/DD")
}
},
deep: true
}
}
Upon setting an input for the dates variable in the view template, I encounter an undefined result for this.params in the console log, and face an error when trying to set this.params.from. Consequently, I attempted accessing it through a method:
methods: {
printParams() {
console.log(this.params)
}
}
By invoking it within the view template, the params object is correctly resolved.
Is there something crucial that I am overlooking here?