I am currently working on a Laravel Vue project that features a component displaying a list of items. Upon mounting, the component triggers an AJAX call to populate the data element. However, there are other elements on the page (outside of the Vue component) that can add items to the database. I want to ensure that the list in the component remains reactive.
mounted() {
this.getTasks();
},
methods: {
getTasks() {
let self = this;
axios.get('/tasks').then(response => {
self.tasks = response.data;
})
.catch(function (error) {
console.log(error);
});
},
}
If a user performs an action that adds a task to the list, is there a way to call the getTasks
method within the component from outside the component?