Question

我的应用程序中的数据初始状态有问题。我正在使用vuex和vue-router，并且我认为异步内容使我感到震惊，但是我不确定如何解决它。

在我的view.vue组件中：

beforeRouteEnter(to, from, next) {
  store.dispatch('assignments/getAssignment', {
    id: to.params.id
  }).then(res => next());
},

在我的模块中：

getAssignment({commit, state}, {id}) {
    return axios.get('/assignments/' + id)
            .then(response => {
                if(response.data.data.type == 'goal_plan') {
                    const normalizedEntity = normalize(response.data.data, assignment_schema);
                    commit('goals/setGoals', {goals: normalizedEntity.entities.goals}, {root: true});
                    commit('goals/setGoalStrategicPriorities', {goal_priorities: normalizedEntity.entities.strategicPriorities}, {root: true});
                    commit('goals/setObjectives', {objectives: normalizedEntity.entities.objectives}, {root: true});
                    commit('goals/setStrategies', {strategies: normalizedEntity.entities.strategies}, {root: true});
                }
                commit('setAssignment', {assignment: response.data.data});
            }).catch(error => {
                console.log(error);
                EventBus.$emit('error-thrown', error);
            });
},

关闭了几个子组件，我想访问state.goals.goals，但最初未定义。我可以解决其中的一些问题，但不是全部。

例如，我有一个view.vue的子组件，其中包括

computed: {
    originalGoal() {
      return this.$store.getters['goals/goalById'](this.goalId);
    },
  },
  data() {
    return {
      form: {
        id: this.originalGoal.id,
        description: this.originalGoal.description,
        progress_type: this.originalGoal.progress_type,
        progress_values: {
          to_reach: this.originalGoal.progress_values.to_reach,
          achieved: this.originalGoal.progress_values.achieved,
        },
        due_at: moment(this.originalGoal.due_at).toDate(),
        status: this.originalGoal.status,
      },

在我开始使用vuex的令人兴奋的日子里，我将最初的目标作为道具进行了传递，因此这不是问题。由于它现在已从状态中拉出，因此我收到一堆错误，它们找不到未定义的各种属性。最终originalGoal会在显示中解析，但永远不会以这种方式显示。

我尝试“观察”计算出的道具，但是我从没看到它何时改变，而且我很确定这绝对不是正确的方法。

那么，有没有办法最初获取数据集？如果没有，一旦设置了数据，我应该如何设置表单值？（欢迎提出任何其他建议，因为我对vuex和vue-router相当陌生。）

Answer 1

因此，如果我在“ mount”中设置表单值，则可以使它起作用。我猜仍然还在学习Vue的生命周期。：）

使用vuex和vue-router时未定义的数据

1 个答案: