With the help of moment, my calendar generates 41 days.
for (let x = 0; x < 42; x++) {
context.add(1, 'd');
let day = {
'date': moment(context),
'events': []
};
}
state.month = days;
After generating the days, I proceed to render them.
<day
v-for="(day, index) in days"
v-bind:day="day"
v-bind:index="index"
v-bind:key="day.id">
0
</day>
To populate each day with events retrieved from the database per month, I fetch and send them to vue.
**Event**
id
name
date
is_accepted
public static function getEventsByMonth($month) {
return Events::whereMonth('date', '=', $month);
}
The main question now is whether there is a vue method to properly bind events to days without manually looping through each event and comparing dates?
Edit:
Upon retrieving events from the database and storing them in my vuestore, they are as follows:
events:Object
2017-04-02 00:00:00:Object
2017-04-14 00:00:00:Object
Below are the generated days:
days:Array[42]
0:Object
1:Object