Vue.js 如何分配mapState数据列表？

目前，我正在制作apex条形图，希望将

mapState

数据列表分配到apex系列数据中

代码如下：

<script>
import { mapState } from 'vuex';
export default {
  data: () => ({
    series: [{
              name: 'Completed',
              data: [44, 55, 57, 58, 56, 61, 58, 63, 60, 66, 67, 62]
            }, {
              name: 'Total',
              data: [100, 90, 101, 100, 98, 87, 105, 97, 114, 94, 112, 100]
          }]
    }),
computed: {
      ...mapState(['userAssignmentProgessTotal','userAssignmentProgessCompleted']),
    },
}
</script>

我想分配如下：

series: [{
              name: 'Completed',
              data: this.userAssignmentProgessTotal
            }, {
              name: 'Total',
              data: this.userAssignmentProgessCompleted
          }]

但得到的错误如下：

Error in data(): "TypeError: Cannot read property 'userAssignmentProgessTotal' of undefined"

我对vuex和vuejs都很陌生。如果我描述得不好，我道歉。谢谢

截图：

[1] 如果您希望

系列

是反应式的，即在需要时保持更改/更新

userassignmentprogestotal

或

userassignmentprogescompleted

更改，使序列a

计算

属性而不是

数据

属性

[2] 如果要手动更新

系列

，请使用

方法

进行更新

系列

---

请公布你得到的确切错误，还有，你在哪里分配这个，你有分配这个的方法吗？还是坐骑？或者你想让它反应？我不知道如何分配它。你能帮我一下吗？当然，如果你想要

反应式

或

手动更新

数据属性，我尝试了两种情况下的回答。我使用了你的第一种方法，得到了相同的错误<代码>数据中的错误（）：“TypeError:无法读取未定义的属性'UserAssignmentProgesTotal'”

Error in data(): "TypeError: Cannot read property 'userAssignmentProgessTotal' of undefined"

import { mapState } from 'vuex';

export default {
  computed: {  
    ...mapState([
      'userAssignmentProgessTotal',
      'userAssignmentProgessCompleted'
    ]),
    series () {
      return [{
        name: 'Completed',
        // If `userAssignmentProgessTotal` is any falsy value it will return the default array else will return `userAssignmentProgessTotal`
        data: this.userAssignmentProgessTotal || [44, 55, 57, 58, 56, 61, 58, 63, 60, 66, 67, 62]
      }, {
        name: 'Total',
        data: this.userAssignmentProgessCompleted || [100, 90, 101, 100, 98, 87, 105, 97, 114, 94, 112, 100]
      }]
    }
  }
}

import { mapState } from 'vuex';

export default {
  data () {
    return {
      series () {
        return [{
          name: 'Completed',
          data: [44, 55, 57, 58, 56, 61, 58, 63, 60, 66, 67, 62]
        }, {
          name: 'Total',
          data: [100, 90, 101, 100, 98, 87, 105, 97, 114, 94, 112, 100]
        }]
      }
    }
  },

  computed: {
    ...mapState([
      'userAssignmentProgessTotal',
      'userAssignmentProgessCompleted'
    ])
  },

  methods: {
    updateSeries () {
      this.$set(this.series, 0, { name: this.series[0].name, data: this.userAssignmentProgessTotal })
      this.$set(this.series, 1, { name: this.series[1].name, data: this.userAssignmentProgessCompleted })
    }
  },

  mounted () {
    // call dispatches to fetch data
    // ...
    // call the method in mounted to update series when component loads 
    // or else whenever you want to update series
    this.updateSeries()  
  }
}