My vuex mutation doesn't work synchronously as expected. Here is the code:
mutations: {
computeStatusData(state, status) {
if (status.active !== true) { return }
const started = new Date(status.startedAt);
started.setHours(0, 0, 0, 0);
const today = new Date();
status.currentDay = Math.floor((today.getTime() - started.getTime()) / (1000 * 60 * 60 * 24));
status.currentWeek = Math.floor(status.currentDay / 7);
if (!status.programm.sections) { console.log('No Sections'); return; }
for (let i = 0; i < status.programm.sections.length; i++) {
if (status.currentWeek <= status.programm.sections[i].to) {
status.currentSection = i;
console.log('Current Section', status.currentSection)
break;
}
}
console.log('new status!', status)
},
In a method of my component I invoke it like this:
async loadSections() {
await somethingElse();
if (this.status && this.programm.sections) {
console.log('Recomputing Status')
this.status.progamm = this.programm;
this.$store.commit('computeStatusData', status);
console.log('updated Status', this.status)
}
this.$nextTick(() => { this.$forceUpdate(); })
},
My console log output is:
Recomputing Status
updated Status {…}
Current Section 0
new status! {…}
If the mutation was synchronous, it would display Current Section 0
and new Status!
before updated Status
, but that's not the case.
It appears to not return a Promise because when I use
console.log(this.$store.commit('computeStatusData', status));
, it just prints undefined
.