Animation stops halfway through when closing the menu and modifying vuex store in the on-click method

[codemeier]

trafficstars

In my app I have a PushRotate menu on the right-hand side. One of the links has an additional click.native callback attached:

  <router-link to="/login" @click.native="logout()">
    <span>Logout</span>
  </router-link>

In the callback handler I call a vuex mutation:

  methods: {
    logout() {
      this.$store.commit("logout");
    },
  },

which in turn looks like this:

    logout(state) {
      state.sessionId = "";
    },

Now when I hit the Logout link in the menu, the menu closes but the animation to revert the page to its normal state (not pushed and rotated) seems to stop halfway through, leaving the page looking a little awkward.

When I comment out the line

// state.sessionId = "";

everything works fine.