Not sure if the issue lies with VueJS or JS itself.
Within my database, I have a string (converted from a JS Object using JSON.stringify()) that appears as follows:
{"type":5,"values":{"7":"/data/images/structured-content/64-7-scico.jpg","8":"<b>wefwe</b>","9":"Nějaký text","10":"/data/images/structured-content/64-10-scico.jpg"}}The goal is to retrieve this string from the database (using Axios), convert it back into a JS object, and assign it to the data in VueJS:
.then(response => {
if (response.data.response === "ok" && response.status == 200) {
// get data
let data = response.data.data.data[0];
// pass name to state
this.objectName = data.name;
// get json in string format
let result = data.content;
// first log
console.log(result);
// convert string to json
let content = JSON.parse( result );
// second log
console.log( content.values );
// update states
this.IDType = content.type;
this.values = content.values;
}
})
Axios, data.name, and content.type are functioning properly. However, the second log (content.values) seems to be returning an observer with empty strings, preventing me from passing them to Vue data effectively. The values within this object remain consistently empty, as depicted below on the screen image. What could be causing this issue? Appreciate your insights!
https://i.sstatic.net/kayWV.png
Debugger output: