vue2中的组件获取不到vuex的值

在 Vue2 中，组件获取不到 vuex 的值，有以下几种可能的原因：

1. 没有正确引入 vuex：在组件中引入 vuex 的 store 对象前，需要确保已经正确安装了 vuex。可以在 main.js 中进行安装：

import Vue from 'vue'
import Vuex from 'vuex'

Vue.use(Vuex)

const store = new Vuex.Store({
  // ...
})

new Vue({
  // ...
  store,
  // ...
})

2. 没有使用 mapState 或 mapGetters 或者使用不正确：在组件中使用 mapState 或 mapGetters 方法，可以将 vuex 的 state 或 getter 映射到组件的 computed 属性中，从而获取数据。

import { mapState, mapGetters } from 'vuex'

export default {
  // ...
  computed: {
    // 使用 mapState 映射 state 中的数据
    ...mapState({
      count: state => state.count
    }),
    // 使用 mapGetters 映射 getter 中的数据
    ...mapGetters({
      count: 'getCount'
    })
  }
  // ...
}

3. 组件没有正确引用 vuex 的数据：如果通过 mapState 或 mapGetters 映射了 vuex 的数据，但是仍然无法获取到数据，可能是因为组件没有正确引用这些数据。

<template>
  <div>
    <p>State: {{ count }}</p>
    <p>Getter: {{ getCount }}</p>
  </div>
</template>

4. vuex 中的数据没有正确定义或者命名不正确：在 vuex 中定义 state 和 getter 时，需要保证数据的正确命名，并且在组件中也要使用正确的名称进行引用。

const store = new Vuex.Store({
  state: {
    count: 0
  },
  getters: {
    getCount: state => state.count
  }
})

import { mapState, mapGetters } from 'vuex'

export default {
  // ...
  computed: {
    ...mapState({
      count: state => state.count
    }),
    ...mapGetters({
      getCount: 'getCount'
    })
  }
  // ...
}

如果以上步骤都没有解决问题，可以考虑在组件中手动引入 vuex 的 store 对象，并通过 store.state 或 store.getters 获取数据。