This can be a simple question but since I'm in a learning curve of vuejs I'm struggling to achieve following task.
I have this method inside one of my vue component.
async loadSuggestedUsers() {
if (!this.suggestionUrl) return false
else this.isSearching = true;
this.cancelPreviousRequest();
await axios.get(`/${Helper.getLocale()}/dashboard/${this.suggestionUrl}`, {
params: {
page: this.suggestedUsersData.page,
per_page: this.suggestedUsersData.perPage,
search_text: this.searchText,
nationality: this.selectedNationalities
},
cancelToken: this.requestToken.token
}).then(({data}) => {
collect(data.data).each((user) => {
if (!this.suggestedUsers.some(obj => obj.id === user.id)) {
this.suggestedUsers.push(user)
} else if (
user.project_specific_job_title_id &&
!this.suggestedUsers.some(obj => obj.project_specific_job_title_id === user.project_specific_job_title_id)
) {
this.suggestedUsers.push(user)
}
})
this.suggestedUsersData.perPage = data.per_page
this.suggestedUsersData.total = data.total
this.isSearching = false
}).catch(error => {
if (error instanceof axios.Cancel) return false;
});
},
but now, Instead of directly calling this method from the component I'm trying to access this by using store .
Under my store, I have a js file called, TestStore.JS
My questions are,
How can I re-create above method in my TestStore.JS and how call that recreated method in my component...
One solution is to create a state for this function in your store and pass its reference to it in the created lifecycle of the component.