0

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: "",
    },
  };
}
  • Does this answer your question? [Vuex - Do not mutate vuex store state outside mutation handlers](https://stackoverflow.com/questions/46044276/vuex-do-not-mutate-vuex-store-state-outside-mutation-handlers) – kissu May 03 '22 at 08:54
  • That answer is for the form. I don't know how to change my v-if to other props that my code still work. – Tú Nguyễn May 03 '22 at 09:22
  • The `v-if` is probably not the culprit as explained in my linked answer. You are mutating your state somewhere. A [repro] would be highly appreciated here IMO. – kissu May 03 '22 at 09:23
  • I think its this v-if because when I delete the `$store.state.cart.user.email == ''` , I don't get the errors. – Tú Nguyễn May 03 '22 at 09:26
  • 1
    You can try pin-pointing the culprit by looking at the stacktrace of these errors - it might lead you to the code which actually mutates Vuex. – IVO GELOV May 03 '22 at 11:37

0 Answers0