About the use of element ui dialog

in the official documentation:
.sync will not work properly if the variable bound by the visible attribute is in the store of Vuex. At this point, you need to remove the .sync modifier, and listens to both the open and close events of Dialog, and executes the corresponding mutation in Vuex to update the value of the variable bound to the visible attribute in the event callback.

how do I understand the bold part above? I can directly control the display and hiding of dialog by changing the value of the variable bound to the visible attribute in store. I don"t need to listen to the open and close events of Dialog. Or do I get it wrong? How do you monitor it?

is there a great god who can explain it?

Jun.26,2021

my understanding is: because visible is controlled by vuex , it must be updated through mutation to change the value in state . To make it clear: when mutation is triggered, it is not unnecessary or directly called mutation , but in the callback of open and close .
I think it's quite understandable. Listen to open close events, which are all written in the official documents.


do you write mutation to make visible=true,close callback where you need to display the pop-up box? do you write mutation to make visible=false do this?

Menu