Currently, I'm attempting to retrieve data from an API and store it in an array. The issue arises when I try to log the response data from the API - the data is displayed just fine. I assign the value of a variable to the data obtained from awaiting the API call. However, when I use console.log on the variable, it shows that the value is an observer. I have tried using async/await and have installed:
"babel-plugin-transform-regenerator": "^6.26.0",
"babel-polyfill": "^6.26.0"
const baseUrl = "http://...";
export default {
name: "report",
data() {
return {
selected: "",
categories: []
};
},
created() {},
methods: {
async getCategories() {
this.categories = await axios
.get(`${baseUrl}/feedback/search`)
.then(res => {
return res.data;
});
}
},
mounted() {
this.getCategories(); // removed and tried adding this line again
console.log("cat ", this.categories);
}
};
This is what I receive: cat -> [__ob__: Observer]. This approach also does not seem to work for me. What am I missing here?
I've been grappling with this issue for hours, trying various solutions found on Stack Overflow without success (or perhaps I'm overlooking something). Being new to Vue.js, I would greatly appreciate some guidance!