Let me begin by describing my scenario. I have a fee_map attribute in my data, which is a list of objects containing information about the fees students have to pay, their balances, payment methods, etc. Additionally, there is a computed property called 'updateOptions' that generates a list of objects with IDs and text suitable for populating a select2 dropdown menu (payment mode). This 'updateOptions' property is called whenever a user interacts with the system. Depending on other user actions, the Program will choose a selected option and update the fee_map structure, which looks like this:
data: {
fee_map: {
1: {
details:{
1: {
option_selected: "1",
}
}
// other attributes
},
2: {
details:{
1: {
option_selected: "2",
}
}
// other attributes
},
}
I have a method called UpdateSelected, which updates the selections by iterating through the fee_map using keys and nested forEach loops. The selected option is then set as follows:
var fee_map = this.fee_map;
t_keys = Object.keys(fee_map);
t_keys.forEach(function(t){
f_keys = Object.keys(fee_map[t].details);
f_keys.forEach(function(f){
fee_map[t].details[f].option_selected = "2";
});
});
However, when I update the 'option_selected' value in this manner, the fee_map does not reflect the new value. What could be the issue here?