vuexアクション(特に1つ)をマップしようとしていますが、エラーが発生し続けますProperty or method "logout" is not defined on the instance but referenced during render.
。これが私のコンポーネントコードです:
<template>
<header id="header">
<div class="logo">
<router-link to="/">Vue Authenticate</router-link>
</div>
<nav>
<ul>
...
<li v-if="authenticated" @click="logout">
Log Out
</li>
</ul>
</nav>
</header>
</template>
<script>
import { mapGetters, mapActions } from "vuex";
export default {
computed: {
...mapGetters({
authenticated: "isAuthenticated",
}),
},
mathods: {
...mapActions(["logout"]),
},
};
</script>
そしてここに私のstore/index.js
ファイルがあります:
import Vue from "vue";
import Vuex from "vuex";
import axios from "axios";
import router from "../router/index.js";
Vue.use(Vuex);
export default new Vuex.Store({
actions: {
logout({commit}) {
localStorage.removeItem("idToken");
localStorage.removeItem("userId");
commit("clearData");
router.push("/")
}
},
});
私が何かを逃している場所について何か考えはありますか?ちなみに、mapGettersは完全に正常に動作します。バージョン3.4.0でvuexを使用しています。
代わりに「mathods」を書いていますmethods
:
methods: {
...mapActions(["logout"]),
},
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加