I have a Vue instance whose data contains an array of objects. I display this data in a table without issue.
Upon clicking the table rows, I set a "selected" property on the corresponding data object using:
key.$set('testing', testing);
Upon setting this value, I add a custom css class the the table row, without issue.
However, if I do a simple output of the entire array of objects at the bottom of the page (such as below), it doesn't get updated to reflect the new "testing" attribute I have added.
{{ gridData | json }}
I was able to reproduce my question using some modified vue.js example code in this JSFiddle:
https://jsfiddle.net/wdmatl/531axrtt/
Notice when you click on rows of data, you either see "testing" or "not testing". But this new object data isn't reflected in the json at the bottom of the page. Why not?
