avil13 / vue-sweetalert2

A convenient wrapper for sweetalert2.
https://avil13.github.io/vue-sweetalert2/
649 stars 75 forks source link

Updated readme with more info about using vue-sweetalert2 with vuex without breaking state machine pattern. #131

Closed Uraharadono closed 3 years ago

Uraharadono commented 3 years ago

I wrote recently a post on my GitHub along with sample demo that is using vue-sweetalert2 to show messages from Ajax calls that are done in Vuex Action.

I think a lot of people would benefit from this, as I spent a lot of time on figuring this out when setting up the project.

avil13 commented 3 years ago

Hi. Thanks for the idea, I have always solved this problem much easier and did not think that something else might be needed)))

// my-vuex-module.ts
import swal from 'sweatalert2';

export const myModule = {
  actions: {
    showMessage() {
      swal('Hello world!!!');
    }
  }
}

In the version you proposed, there are a lot of problems. 1) Strong code binding. 2) Substitution of contexts. 3) And as a result - difficulty in understanding

Point by point, a little more detail:

1: Alert state, you have in a separate stor. You keep the whole stor that would show one small message. You could at least call the appropriate option inside the action. The swal object itself is copied into the stack. The state is a place for data, not for objects controlling business logic.

2: All your examples you show from a component. It's at a higher level, so it would make sense that it's the only one that knows to show a message if it succeeds.

3: You have to remember about the new actions, make sure they are in sync in different places. There is no typing and therefore a big chance to make a mistake.

Uraharadono commented 3 years ago

@avil13 Hey Avil, thanks a lot for such thorough explanation. I was not aware that it is possible to use Vuex in actions like: import swal from 'sweatalert2';

As I also came across different questions on StackOverflow or some other sites where people where asking this same thing. Would you mind including this somewhere in documentation so people like me and this person https://laracasts.com/discuss/channels/vue/use-sweet-alert-inside-vuex

Can be pointed out to the official documentation?

avil13 commented 3 years ago

Okay, I'll do that as soon as I'm free. Thank you for responding.