Vuex存储更改在组件中不起作用

时间:2020-08-25 12:09:46

标签: vue.js vue-component vuex store

我有一个用于存储和删除数组的基本存储

state: {
    assessmentTypes : []
  },
  mutations: {
    setAssessmentTypes(state, assessmentTypes) {
      assessmentTypes.forEach(assessmentType => {
          state.assessmentTypes.push(assessmentType);
      });
    },
    removeAssessmentType ( state, assessmentTypeId ) {
        let assessmentTypeIndex = state.assessmentTypes.map(assessmentType => assessmentType.id).indexOf(assessmentTypeId);
        state.assessmentTypes.splice(assessmentTypeIndex, 1)
    }
  }

我在其中一个组件中获得了计算属性的状态评估类型。

computed:{
assessmentTypes : {
    get () {
      return this.$store.state.assessmentTypes;
    }
}

问题是我在dom中循环数组以列出div,但是计算出的属性不是反应性的。当我(通过操作)从数组中删除或向数组中插入新对象时,dom不会重新呈现。

对象结构

{
      "id": "T7pLDdjmFWAqGiuqB",
      "name": "bbb",
      "code": "BBB",
      "properties": {
          combinationOfAssessments: false,
          staffCanCreateInstance: false
      },
      "identifyingContext": {
          "semId": "2",
          "batchId": "54",
          "staffId": "155",
          "subjectId": "966",
          "subbatchId": "391"
      },
      "permissions": {
          "hod": "1",
          "staff": "1"
      },
      "isActive": "1",
      "createdBy": null,
      "createdUserName": null,
      "createdByUserType": null,
      "createdDate": null,
      "updatedDate": null,
      "updatedBy": null,
      "updatedUserName": null,
      "updatedByUserType": null,
      "propertiesValue": null
  }

0 个答案:

没有答案