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);
});
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 watch
ing 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
}
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With