Vue报错解决[Vue warn]: Error in render: “TypeError: Cannot read property ‘state‘ of undefined“-Toy模板网

这篇具有很好参考价值的文章主要介绍了Vue报错解决[Vue warn]: Error in render: “TypeError: Cannot read property ‘state‘ of undefined“。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

报错

Vue2项目中报错：
[Vue warn]: Error in render: “TypeError: Cannot read property ‘state’ of undefined”
[Vue warn]: Error in mounted hook: “TypeError: Cannot read property ‘dispatch’ of undefined”
Vue报错解决[Vue warn]: Error in render: “TypeError: Cannot read property ‘state‘ of undefined“,BUG解决,前端,# Vue,vue.js,javascript,前端,vue报错解决,vuex

常见原因

这个错误提示通常出现在 Vue 组件中，它尝试读取 Vuex store 的 state 对象，但是该对象没有被定义。这可能是由以下几个原因引起的：

1.Vuex store 模块没有正确导入。可以在 Vue 组件中使用以下代码导入store：

import store from '@/store'

这假设 store.js 文件位于 src/store 目录中。如果store.js 文件位于其他目录中，请相应地更改导入路径。

2.组件没有正确连接到 Vuex store。可以在 Vue 组件中使用以下代码将组件连接到 Vuex store：

import { mapState } from 'vuex'

export default {
  computed: {
    ...mapState(['myState'])
  }
}

这里的 myState 是Vuex store 中定义的状态名称。如果组件中使用其他名称，请相应地更改代码。

3.Vuex store 中没有定义所需的状态。
如果 Vuex store 中没有定义尝试使用的状态，则会出现这个错误。可以在 store.js 文件中使用以下代码定义状态：

const state = {
  myState: null
}

解决方法

反复确认代码后，发现并没有上述问题。所以想着看一下是不是版本问题，打开package.json一看vuex是4版本的。
Vue报错解决[Vue warn]: Error in render: “TypeError: Cannot read property ‘state‘ of undefined“,BUG解决,前端,# Vue,vue.js,javascript,前端,vue报错解决,vuex
这就好解决了：
运行以下命令卸载 Vuex 4：

npm uninstall vuex

运行以下命令安装 Vuex 3：文章来源地址https://www.toymoban.com/news/detail-690257.html

npm install vuex@3

到了这里，关于Vue报错解决[Vue warn]: Error in render: “TypeError: Cannot read property ‘state‘ of undefined“的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！