javascript - Nuxt,将 Vuex 存储拆分为单独的文件会出现错误:未知突变类型:登录
问题描述
我正在尝试将我的 Nuxt Vuex 存储文件拆分为单独的文件。并且没有将所有Vuex 放入一个巨大的文件中getters
。顺便说一下,这个演示项目在 Github 上。mutations
actions
我读过这个官方的 Nuxt Vuex Store 文档;但似乎无法让它工作。在哪里放东西有点模糊。
我在这些文件中有以下内容:
下面是我的:store/index.js
import Vue from "vue";
import Vuex from "vuex";
import Auth from "./modules/auth";
Vue.use(Vuex);
export const store = () => {
return new Vuex.Store({
state: {
},
modules: {
Auth
}
})
}
这是在我的:store/auth.js
const state = () => {
username: null
};
const getters = {
username: state => {
return state.username;
},
isAuthenticated: state => {
return state.username != null;
}
};
const mutations = {
login: (vuexContext, username) => {
vuexContext.username = username;
this.$router.push("/dashboard");
},
logout: vuexContext => {
vuexContext.username = null;
this.$router.push("/");
}
};
const actions = {
};
export default {
state,
getters,
mutations,
actions,
};
最后在我的:pages/index.vue
这就是我称之为登录突变的地方:
<script>
export default {
layout: "non-logged-in",
data() {
return {
username: null
}
},
methods: {
onSubmit() {
this.$store.commit("login", this.username);
}
}
}
</script>
我得到的错误:
[vuex] unknown mutation type: login
我在这里做错了什么?我以为我正确地导入了所有的东西store/index.js
解决方案
您必须在 store/index.js 文件中像这样导出存储常量:
export default store
将此代码行放在文件的末尾。
推荐阅读
- parse-server - 解析服务器 result.attributes 与 get()
- javascript - 如何通过导航将数据传递到平面列表中?
- python - numpy快速傅里叶变换的数组正确排序
- java - 如何在 jpa 查询中加入具有多对多关系的两个实体
- css - CSS3 动画在 Firefox 中效果不佳(过渡不流畅)
- php - 在我的 WordPress 自定义插件“函数名称必须是字符串”中,我正在使用 $get_the_author_meta()
- java - 获取当前处理块的先前块值 - 弹簧批处理
- javascript - 如何解析无序列表
- 是兄弟姐妹
- flutter - 如何在颤动中显示/隐藏密码?
- java - 为什么javers快照表序列乘以100