我正在尝试从api fetch中映射我的事件,并将每个事件添加到dots
数组中每天:
case "EVENTS_SUCCESS":
const events = {};
const dayEvents = [];
action.data.events.map(event => {
const {
year: startYear,
month: startMonth,
day: startDay,
hour: startHour,
minutes: startMinute
} = event.start_date_details;
const {
hour: endHour,
minutes: endMinute
} = event.end_date_details;
const startDate = `${startYear}-${startMonth}-${startDay}`;
const startTime = `${startHour}-${startMinute}`;
const endTime = `${endHour}-${endMinute}`;
let newEvent = {
key: event.title,
name: event.title,
color: "blue",
selectedDotColor: "white",
categories: event.categories,
startTime: startTime,
endTime: endTime
};
events[startDate] = {
// add newEvent dots array if startdate is same day
dots: [newEvent],
disabled: false
};
});
return {
...events
};
所以我的数据将是:
{
"16-3-2018": {
dots: [{key: 'blah', title: 'blah' ...},
{key: 'blah', title: 'blah' ...}]
disabled: false
}
}
但是,我只能在dots
数组中获得一个事件。如何在同一天向阵列插入多个事件?
示例json:
{
"events":[
{
"id":516,
"global_id":"wordpress.rguc.co.uk?id=516",
"global_id_lineage":[
"wordpress.rguc.co.uk?id=516"
],
"author":"2",
"status":"publish",
"date":"2017-12-14 12:00:37",
"date_utc":"2017-12-14 12:00:37",
"modified":"2018-01-24 15:16:25",
"modified_utc":"2018-01-24 15:16:25",
"url":"http:\/\/wordpress.rguc.co.uk\/event\/test-event\/",
"rest_url":"http:\/\/wordpress.rguc.co.uk\/wp-json\/tribe\/events\/v1\/events\/516",
"title":"testevent",
"description":"<p>RG media team meetiNg to discuss anything and everything<\/p>",
"excerpt":"",
"image":false,
"all_day":false,
"start_date":"2018-02-14 08:00:00",
"start_date_details":{
"year":"2018",
"month":"02",
"day":"14",
"hour":"08",
"minutes":"00",
"seconds":"00"
},
"end_date":"2018-04-24 17:00:00",
"end_date_details":{
"year":"2018",
"month":"04",
"day":"24",
"hour":"17",
"minutes":"00",
"seconds":"00"
},
"utc_start_date":"2018-02-14 08:00:00",
"utc_start_date_details":{
"year":"2018",
"month":"02",
"day":"14",
"hour":"08",
"minutes":"00",
"seconds":"00"
},
"utc_end_date":"2018-04-24 16:00:00",
"utc_end_date_details":{
"year":"2018",
"month":"04",
"day":"24",
"hour":"16",
"minutes":"00",
"seconds":"00"
},
"timezone":"Europe\/London",
"timezone_abbr":"GMT",
"cost":"",
"cost_details":{
"currency_symbol":"",
"currency_position":"prefix",
"values":[
]
},
"website":"",
"show_map":true,
"show_map_link":true,
"hide_from_listings":false,
"sticky":false,
"featured":false,
"categories":[
{
"name":"firm1",
"slug":"firm1",
"term_group":0,
"term_taxonomy_id":59,
"taxonomy":"tribe_events_cat",
"description":"",
"parent":60,
"count":4,
"filter":"raw",
"id":59,
"urls":{
"self":"http:\/\/wordpress.rguc.co.uk\/wp-json\/tribe\/events\/v1\/categories\/59",
"collection":"http:\/\/wordpress.rguc.co.uk\/wp-json\/tribe\/events\/v1\/categories",
"up":"http:\/\/wordpress.rguc.co.uk\/wp-json\/tribe\/events\/v1\/categories\/60"
}
},
{
"name":"year 1",
"slug":"year-1",
"term_group":0,
"term_taxonomy_id":60,
"taxonomy":"tribe_events_cat",
"description":"",
"parent":0,
"count":3,
"filter":"raw",
"id":60,
"urls":{
"self":"http:\/\/wordpress.rguc.co.uk\/wp-json\/tribe\/events\/v1\/categories\/60",
"collection":"http:\/\/wordpress.rguc.co.uk\/wp-json\/tribe\/events\/v1\/categories"
}
}
],
"tags":[
{
"name":"tester",
"slug":"tester",
"term_group":0,
"term_taxonomy_id":57,
"taxonomy":"post_tag",
"description":"",
"parent":0,
"count":1,
"filter":"raw",
"id":57,
"urls":{
"self":"http:\/\/wordpress.rguc.co.uk\/wp-json\/tribe\/events\/v1\/tags\/57",
"collection":"http:\/\/wordpress.rguc.co.uk\/wp-json\/tribe\/events\/v1\/tags"
}
}
],
"venue":{
"id":542,
"author":"2",
"status":"publish",
"date":"2018-01-24 15:16:25",
"date_utc":"2018-01-24 15:16:25",
"modified":"2018-01-24 15:16:25",
"modified_utc":"2018-01-24 15:16:25",
"url":"http:\/\/wordpress.rguc.co.uk\/venue\/medical-photography\/",
"venue":"Medical Photography",
"show_map":true,
"show_map_link":true,
"global_id":"wordpress.rguc.co.uk?id=542",
"global_id_lineage":[
"wordpress.rguc.co.uk?id=542"
]
},
"organizer":[
]
},
{
"id":538,
"global_id":"wordpress.rguc.co.uk?id=538",
"global_id_lineage":[
"wordpress.rguc.co.uk?id=538"
],
"author":"2",
"status":"publish",
"date":"2018-01-21 16:36:32",
"date_utc":"2018-01-21 16:36:32",
"modified":"2018-01-21 16:40:13",
"modified_utc":"2018-01-21 16:40:13",
"url":"http:\/\/wordpress.rguc.co.uk\/event\/testing-again\/",
"rest_url":"http:\/\/wordpress.rguc.co.uk\/wp-json\/tribe\/events\/v1\/events\/538",
"title":"testing again",
"description":"",
"excerpt":"",
"image":false,
"all_day":false,
"start_date":"2018-02-14 08:00:00",
"start_date_details":{
"year":"2018",
"month":"02",
"day":"14",
"hour":"08",
"minutes":"00",
"seconds":"00"
},
"end_date":"2018-02-14 17:00:00",
"end_date_details":{
"year":"2018",
"month":"02",
"day":"14",
"hour":"17",
"minutes":"00",
"seconds":"00"
},
"utc_start_date":"2018-02-14 08:00:00",
"utc_start_date_details":{
"year":"2018",
"month":"02",
"day":"14",
"hour":"08",
"minutes":"00",
"seconds":"00"
},
"utc_end_date":"2018-02-14 17:00:00",
"utc_end_date_details":{
"year":"2018",
"month":"02",
"day":"14",
"hour":"17",
"minutes":"00",
"seconds":"00"
},
"timezone":"Europe\/London",
"timezone_abbr":"GMT",
"cost":"",
"cost_details":{
"currency_symbol":"",
"currency_position":"prefix",
"values":[
]
},
"website":"",
"show_map":true,
"show_map_link":true,
"hide_from_listings":false,
"sticky":false,
"featured":false,
"categories":[
{
"name":"firm1",
"slug":"firm1",
"term_group":0,
"term_taxonomy_id":59,
"taxonomy":"tribe_events_cat",
"description":"",
"parent":60,
"count":4,
"filter":"raw",
"id":59,
"urls":{
"self":"http:\/\/wordpress.rguc.co.uk\/wp-json\/tribe\/events\/v1\/categories\/59",
"collection":"http:\/\/wordpress.rguc.co.uk\/wp-json\/tribe\/events\/v1\/categories",
"up":"http:\/\/wordpress.rguc.co.uk\/wp-json\/tribe\/events\/v1\/categories\/60"
}
},
{
"name":"year 1",
"slug":"year-1",
"term_group":0,
"term_taxonomy_id":60,
"taxonomy":"tribe_events_cat",
"description":"",
"parent":0,
"count":3,
"filter":"raw",
"id":60,
"urls":{
"self":"http:\/\/wordpress.rguc.co.uk\/wp-json\/tribe\/events\/v1\/categories\/60",
"collection":"http:\/\/wordpress.rguc.co.uk\/wp-json\/tribe\/events\/v1\/categories"
}
}
],
"tags":[
],
"venue":[
],
"organizer":[
]
},
{
"id":544,
"global_id":"wordpress.rguc.co.uk?id=544",
"global_id_lineage":[
"wordpress.rguc.co.uk?id=544"
],
"author":"2",
"status":"publish",
"date":"2018-02-07 10:20:19",
"date_utc":"2018-02-07 10:20:19",
"modified":"2018-02-07 10:20:49",
"modified_utc":"2018-02-07 10:20:49",
"url":"http:\/\/wordpress.rguc.co.uk\/event\/matts-birthday\/",
"rest_url":"http:\/\/wordpress.rguc.co.uk\/wp-json\/tribe\/events\/v1\/events\/544",
"title":"matts birthday",
"description":"<p>matts birthday<\/p>",
"excerpt":"",
"image":false,
"all_day":false,
"start_date":"2018-03-16 08:00:00",
"start_date_details":{
"year":"2018",
"month":"03",
"day":"16",
"hour":"08",
"minutes":"00",
"seconds":"00"
},
"end_date":"2018-03-16 17:00:00",
"end_date_details":{
"year":"2018",
"month":"03",
"day":"16",
"hour":"17",
"minutes":"00",
"seconds":"00"
},
"utc_start_date":"2018-03-16 08:00:00",
"utc_start_date_details":{
"year":"2018",
"month":"03",
"day":"16",
"hour":"08",
"minutes":"00",
"seconds":"00"
},
"utc_end_date":"2018-03-16 17:00:00",
"utc_end_date_details":{
"year":"2018",
"month":"03",
"day":"16",
"hour":"17",
"minutes":"00",
"seconds":"00"
},
"timezone":"Europe\/London",
"timezone_abbr":"GMT",
"cost":"",
"cost_details":{
"currency_symbol":"",
"currency_position":"prefix",
"values":[
]
},
"website":"",
"show_map":true,
"show_map_link":true,
"hide_from_listings":false,
"sticky":false,
"featured":false,
"categories":[
{
"name":"firm1",
"slug":"firm1",
"term_group":0,
"term_taxonomy_id":59,
"taxonomy":"tribe_events_cat",
"description":"",
"parent":60,
"count":4,
"filter":"raw",
"id":59,
"urls":{
"self":"http:\/\/wordpress.rguc.co.uk\/wp-json\/tribe\/events\/v1\/categories\/59",
"collection":"http:\/\/wordpress.rguc.co.uk\/wp-json\/tribe\/events\/v1\/categories",
"up":"http:\/\/wordpress.rguc.co.uk\/wp-json\/tribe\/events\/v1\/categories\/60"
}
},
{
"name":"year 1",
"slug":"year-1",
"term_group":0,
"term_taxonomy_id":60,
"taxonomy":"tribe_events_cat",
"description":"",
"parent":0,
"count":3,
"filter":"raw",
"id":60,
"urls":{
"self":"http:\/\/wordpress.rguc.co.uk\/wp-json\/tribe\/events\/v1\/categories\/60",
"collection":"http:\/\/wordpress.rguc.co.uk\/wp-json\/tribe\/events\/v1\/categories"
}
}
],
"tags":[
],
"venue":[
],
"organizer":[
]
}
],
"rest_url":"http:\/\/wordpress.rguc.co.uk\/wp-json\/tribe\/events\/v1\/events\/?page=1&per_page=10&start_date=2018-02-07 23:59:00&end_date=2020-02-08 08:56:30",
"total":"3",
"total_pages":1
}
答案 0 :(得分:0)
那是因为你每次都要压倒它 请尝试以下方法:
//...
events[startDate] = events[startDate] || {dots: []};
events[startDate] = {
// add newEvent dots array if startdate is same day
dots: [...events[startDate].dots, newEvent],
disabled: false
};
//...
答案 1 :(得分:0)
通过将事件推送到点阵列来添加事件:
events[startDate].dots.push(newEvent);
如果直接访问dots属性,则必须在创建事件[startDate]时对其进行初始化。像:
if (!events[startDate]) {
events[startDate] = {dots: [], disabled = false}
}