Saturday, May 11, 2024
 Popular · Latest · Hot · Upcoming
137
rated 0 times [  140] [ 3]  / answers: 1 / hits: 17050  / 9 Years ago, mon, january 11, 2016, 12:00:00

I have a Vue.js app of which I have a couple of components for, just to handle some repetitive tasks.



I'm also fetching data from an AJAX request.



What I'd like some input on is if there is an event that fires after Vue data (treeData and flatTreeData) has been updated and actioned so I can perform any additional actions?



var app = new Vue({
el: 'body',
data: {
treeData: {items: {}},
flatTreeData: [],
},
});

$.getJSON('./paths.json').done(function(data) {

// apply the file structure to the vue app
demo.treeData = data;

demo.flatTreeData = flattenTree(data);

});

More From » vue.js

 Answers
1

You can use the watch property of the Vue instance to add listeners to variable changes: http://vuejs.org/api/#watch



watch: {
'treeData': function (val, oldVal) {
console.log('new: %s, old: %s', val, oldVal)
}
}


If you are going to be watching an object like treeData, you may need to use the deep flag to watch the entire object tree.



watch: {
'treeData': {
handler:function (val, oldVal){
console.log('new: %s, old: %s', val, oldVal)
},
deep: true
}
}

[#63767] Friday, January 8, 2016, 9 Years  [reply] [flag answer]
Only authorized users can answer the question. Please sign in first, or register a free account.
alfonsok

Total Points: 386
Total Questions: 101
Total Answers: 90

Location: Puerto Rico
Member since Sun, Jun 27, 2021
3 Years ago
alfonsok questions
Sat, Jun 5, 21, 00:00, 3 Years ago
Wed, Jun 2, 21, 00:00, 3 Years ago
Mon, Oct 5, 20, 00:00, 4 Years ago
;