I'm currently working on transforming the API response to make it more suitable for constructing two tables. Despite adding debugging outputs within my function in created(), I am witnessing the desired output temporarily, but upon further examination, it appears that the data has not actually changed. There seems to be some strange behavior possibly related to this, although I have been unable to resolve it.
This is what my current code looks like:
export default {
name: 'component',
data: function() {
return {
tableOne: [],
}
},
computed: {
...mapState([
'modal'
])
},
created() {
api.get_appointments()
.then(appointments => {
for (var i = 0; i < appointments.length; i++) {
this.tableOne.push(
{
tech: appointments[i].tech_name,
date: appointments[i].scheduled_date
}
)
}
});
},
};
The api.get_appointments() function implementation is as follows:
get_appointments() {
return axios({
method: "get",
url: '/appointments'
})
.then(res => (res.data.data))
.catch(error => {return error});
};