If you want to check out my codesandbox setup, you can find it here. In this setup, three dates should be printed.
The important parts of the code are as follows:
import Vue from "vue";
import App from "./App";
import Vuex from "vuex";
Vue.use(Vuex);
const { DateTime } = require("luxon");
Vue.config.productionTip = false;
var store = new Vuex.Store({
debug: true,
state: {
dateTimes: [
{ startTime: DateTime.local(), meta: "test" },
{ startTime: DateTime.local().plus({ days: 2 }), meta: "test" }
]
},
mutations: {
addItem(state) {
var test = {
startTime: DateTime.local().plus({ days: 1 }),
meta: "test"
};
for (var i = 0; i < state.dateTimes.length; i++) {
if (state.dateTimes[i].startTime > test.startTime) {
state.dateTimes.splice(i, 0, state.dateTimes);
}
}
state.dateTimes.push(test);
}
}
});
new Vue({
el: "#app",
store: store,
components: { App },
template: "<App/>",
created: function() {
this.$store.commit("addItem");
}
});
I'm encountering an error message that says:
Error in render: "InternalError: too much recursion"Could someone please advise on the proper way to splice an item into a Vuex array?