uniapp: vuex $store的值为undefined
uniappvuex store值为undefined
·
uniapp: vuex $store的值为undefined
如标题,在生命周期函数打印 $store 的值为undefined
且报错: TypeError: Cannot read property ‘state’ of undefined
因为只是最基础的vuex的使用,而且反复对比了代码并没有问题,所以很困惑出错的原因。
为了找到出错原因 , 笔者采用页面局部使用vuex的方法,发现能够正常输出值。
// homepage.vue 页面
import store from '@/store/index.js'
console.log(store.state.count) // 输出 6 (设置的值)
由此,可以把问题原因定位到
**
在main.js中没有成功挂载 store
**
打开main.js,发现uniapp 的默认的 挂载实例的方法有两个,分别在两个代码块中
// #ifndef VUE3
console.log('不是vue3环境 - 执行代码块')
import Vue from 'vue'
import App from './App'
Vue.config.productionTip = false
App.mpType = 'app'
const app = new Vue({
...App
})
app.$mount()
// #endif
// #ifdef VUE3
console.log('是vue3环境 - 执行代码块')
import { createSSRApp } from 'vue'
import App from './App.vue'
export function createApp() {
const app = createSSRApp(App)
return {
app,
store
}
}
// #endif
而store的挂载代码 只在第二个代码块中有挂载,而在第一个代码块中没有挂载。
至此,问题原因已经找到。
在两个代码块中,分别console
如上图可知: 编译时只进入了 不是vue3环境 的代码块区域 。而在该区域内,没有引入 store 对象, 所以报错
**
解决方法: 在 该代码块中 ,在store挂载到vue实例对象上
**
const app = new Vue({
...App,
store
})
总结: 对c,c++的宏定义的不了解,不知道代码块的运行机制。
更多推荐
已为社区贡献3条内容
所有评论(0)