vue2 组件里怎么获取vuex存储的数据
时间: 2024-10-11 19:07:06 浏览: 29
Vue递归组件+Vuex开发树形组件Tree–递归组件的简单实现
在Vue 2中,组件想要从Vuex状态管理库中获取数据,通常需要通过`store`实例来访问。首先,你需要在组件的构造函数`created()`或者生命周期钩子`watch()`中注入`store`:
```javascript
// 引入Vuex store
import { mapState } from 'vuex'
export default {
// ...
created() {
this.$store = store // 如果未全局注入
this.state = mapState({
// 映射你想获取的状态到组件的data属性上
// 示例:获取名为'todoList'的状态
todoList: state => state.todoList
})
},
data() {
return {
// 这里的state就是来自Vuex的状态
...this.state
}
},
// ...
}
```
然后,在组件内部可以直接使用`this.todoList`来访问Vuex中的数据了。记得要在`mapState`映射的对象中明确指定你要获取哪些状态。
如果你使用的是基于插件的方式注入Vuex,那么可以在`methods`中直接注入`store`:
```javascript
computed: {
todoList() {
return this.$store.state.todoList
}
},
```
阅读全文