Реализовать календарь с динамическими событиями в реагировать на натив

Question

1. Я хочу реализовать календарь, но динамическое событие не отображается, если выбрана дата, то я пробовал использовать библиотеку реагировать - родной - календарь, но все же разрешить выяснить это?Любое предложение, связанное с этим.Спасибо за Расширенный импорт Календаря Google React ,

Импорт:

    import { Component } from 'react';
        import {    Text,    View,    StyleSheet,    Image,    NetInfo }
        from 'react-native'; import { Agenda } from
        'react-native-calendars'; 
        import moment from 'moment'; 

мои переменные:

        let url = '';
        let eventText = '';
        let isevent = false;
        let eventDate = '';
        let finalLength = 0;
        let currentdate = new Date().getDate();
        let currentmonth = new Date().getMonth() + 1; //Current Month. let
        currentyear = new Date().getFullYear(); //Current Year. let
        formatCurrentData = '';

        let timeMax = '2019-09-23T10:00:00-07:00';
        let timeMin ='2019-09-21T10:00:00-07:00'; 
        let timeZone = 'GMT+5:30';
        let date;

Компонент класса:

        export default class EventCalendar extends Component {   
        constructor(props) {
              super(props);
              this.state = {
                 items: [],
                 currentMonth: '',
                 localArray: [],
                 olderArr: [],
                 finalLength: 0,
                 selectedDateShow: '',
                 currentdate: ''
              };    }    componentDidMount() {
              formatCurrentData = currentyear + "-" + currentmonth + "-" + currentdate;
              NetInfo.isConnected.fetch().done(isConnected => {
                 if (isConnected == true) {
                    axios
                       .get(url)
                       .then(res => {
                          return res.data;
                       })
                       .then(data => {
                          this.onDayPress({
                             dateString: "2019-09-28",
                             day: 28,
                             month: 9,
                             timestamp: 1569651352,
                             year: 2018
                          }, "2019-09-28");
                       });
                 } else {
                 }
              }); 
   }

Функция onDayPress:

              onDayPress(day, lastdate) {
              let selectedDate = day.year + "-" + day.month + "-" + day.day;
              date = day.dateString;
              this.setState({ currentdate: day.dateString })
              let PreviousDate = parseFloat(day.day) - 1;
              timeMax = selectedDate + "T10:00:00-07:00";
              timeMin = day.year + "-" + day.month + "-" + PreviousDate + "T10:00:00-07:00";
              NetInfo.isConnected.fetch().done(isConnected => {
                 if (isConnected == true) {
                    let url =
                       url;
                    axios
                       .get(url)
                       .then(res => {
                          return res.data;
                       })
                       .then(data => {
                          let lenghtArray = data.items.length;
                          setTimeout(() => {
                             let DateArrlength = this.state.items[date].length;
                             if (DateArrlength == 1) {
                                for (let i = 0; i < lenghtArray; i++) {
                                   this.state.items[date].push({
                                      eventName: data.items[i].summary,
                                      isAdd: "true"
                                   });

                                   if (i == lenghtArray - 1) {
                                      let finalLength = this.state.items[date].length;

                                      console.warn('Array of items before', this.state.items[date])
                                      this.state.items[lastdate] = [];
                                      console.warn('Array of items', this.state.items[date])
                                      for (i = 0; i < finalLength - 1; i++) {
                                         delete this.state.items[lastdate]
                                      } }}}}, 1000);});}); }    render() {
              return (
                 <View style={{ backgroundColor: '#FFFFFF', flex: 1 }}>
                    <Agenda
                       items={this.state.items}
                       loadItemsForMonth={this.loadItems.bind(this)}
                       selected={formatCurrentData}
                       renderItem={this.renderItem.bind(this)}
                       renderEmptyDate={this.renderEmptyDate.bind(this)}
                       rowHasChanged={this.rowHasChanged.bind(this)}
                       onDayPress={(day) => this.onDayPress(day, this.state.currentdate)}
                       theme={{
                          agendaKnobColor: '#BD10E0', selectedDayBackgroundColor: '#BD10E0',
                          dotColor: '#FFFFFF', monthTextColor: '#BD10E0', indicatorColor: '#BD10E0',
                          agendaDayTextColor: '#BD10E0', agendaDayNumColor: '#BD10E0',
                          agendaTodayColor: '#BD10E0', todayTextColor: '#BD10E0',
                          selectedDotColor: '#BD10E0',
                       }}
                    />
                 </View>
              );}

Функция loadItems:

           loadItems(day) {
              setTimeout(() => {
                 for (let i = -15; i < 85; i++) {
                    const time = day.timestamp + i * 24 * 60 * 60 * 1000;
                    const strTime = this.timeToString(time);

                    if (!this.state.items[strTime]) {
                       this.state.items[strTime] = [];
                       const numItems = Math.floor(Math.random() * 5);
                       this.state.items[strTime].push({
                          name: "Item for " + strTime,
                          height: Math.max(90, Math.floor(Math.random() * 130))
                       });
                       for (let j = 0; j < numItems; j++) {
                       }
                    }}
                 const newItems = {};
                 Object.keys(this.state.items).forEach(key => {
                    newItems[key] = this.state.items[key];
                 });
                 this.setState({
                    items: newItems
                 });
              }, 1000);}    renderItem(items, index) {
              if (items.isAdd == "true") {
                 return (
                    <View style={{ flexDirection: 'row' }}>
                       <View style={[styles.item, { height: items.height }]}>
                          <Text style={{ color: "#473F4E", fontSize: 15 }}>
                             {items.eventName}
                          </Text>
                          <View
                             style={{ flexDirection: "row", alignItems: "center", marginTop: 4 }}
                          >
                             <Text style={{ color: "#BD10E0", fontSize: 12, marginLeft: 6 }}>4 pm</Text>
                          </View>
                          <Text style={{ marginTop: 4, color: "#959595", fontSize: 12 }}>Kuwait city</Text>
                       </View>
                    </View>
                 );}}

           renderEmptyDate() {
              return (
                 null
              );}    rowHasChanged(r1, r2) {
              return r1.name !== r2.name;    }    timeToString(time) {
              const date = new Date(time);
              return date.toISOString().split('T')[0];    }} 

Стиль:

const styles = StyleSheet.create({    item: {
              backgroundColor: '#FFFFFF',
              flex: 1,
              borderRadius: 5,
              padding: 10,
              marginRight: 10,
              marginTop: 17,    },    emptyDate: {
              height: 15,
              flex: 1,
             paddingTop: 30    }});