'Error: [vuex] do not mutate vuex store state outside mutation handlers because of v-if v-else

I think I do not mutate any vuex store outside mutation handlers but I still got this error May be its because of my v-if, v-else. This is my code:

<v-btn
    v-if="$store.state.cart.user.email == '' && loginButtonVisible"
    nuxt
    to="/login"
    min-width="100"
    icon
  >
    <v-icon size="20">mdi-account-outline</v-icon>
    <p style="margin: 0" class="text-capitalize">Login</p>
  </v-btn>
  <v-btn
    v-else-if="$store.state.cart.user.email == '' && !loginButtonVisible"
    nuxt
    to="/register"
    min-width="100"
    icon
  >
    <v-icon size="20">mdi-account-outline</v-icon>
    <p style="margin: 0" class="text-capitalize">Register</p>
  </v-btn>
  <v-btn v-else @click="$store.commit('cart/LogOut')" min-width="100" icon>
    <p style="margin: 0" class="text-capitalize">Logout</p>
    <v-icon size="20">mdi-logout</v-icon>
  </v-btn>

And this is my store/state.js file:

  export default function (params) {
  return {
    cart: [],
    user: {
      email: "",
      idToken: "",
    },
  };
}


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source