One of the functions I have is to store an expense in my application.
storeExpense(context, params){
axios.post('api/expenses', params)
.then( response => {
context.dispatch('getExpenses')
})
.catch( error => {
context.commit('errors', error.response.data.errors)
//console.log(error.response.data.errors);
})
}
When a user clicks the submit button on my component, I simply call this action using dispatch.
store(){
this.$store.dispatch('storeExpense',this.expense)
}
Now that I want to use sweetalert for feedback, I'm unsure of how to integrate it after a successful post request with axios.
I attempted to include it within the action itself like this:
storeExpense(context, params){
axios.post('api/expenses', params)
.then( response => {
context.dispatch('getExpenses')
this.$swal(
'Success',
'Expense has been updated!',
'success'
)
})
.catch( error => {
context.commit('errors', error.response.data.errors)
//console.log(error.response.data.errors);
})
}
But nothing happened because it's in the action file. Should I instead call it within my component like this?
this.$store.dispatch('storeExpense',this.expense)
.then( response => {
this.$swal(
'Success',
'Expense has been created!',
'success'
)
Do you have any suggestions on how best to implement this? Thank you!
I am new to vuejs and vuex