Отображение выбранной даты в пользовательском календаре React native - PullRequest
Новая
       16

Отображение выбранной даты в пользовательском календаре React native

0 голосов
/ 23 марта 2020

Таким образом, я создал собственный календарь для приложения Appointement, который выглядит следующим образом: enter image description here

отображает текущую неделю и дату дней. до сих пор эти временные интервалы представляют собой массив stati c, который я создал и отобразил в виде плоского списка: 

this.state = {
      timeList: [
        { id: 1, time: "08:00 am" },
        { id: 2, time: "09:00 am" },
        { id: 3, time: "10:00 am" },
        { id: 4, time: "11:00 am" },
        { id: 5, time: "12:00 pm" },
        { id: 6, time: "01:00 pm" },
        { id: 7, time: "02:00 pm" },
        { id: 8, time: "03:00 pm" },
        { id: 9, time: "04:00 pm" },
        { id: 10, time: "05:00 pm" },
        { id: 11, time: "06:00 pm" },
        { id: 12, time: "07:00 pm" },
        { id: 13, time: "08:00 pm" }
      ]
    };
and:
<FlatList
            data={this.state.timeList}
            renderItem={({ item, index }) => this.renderTimeData(item, index)}
            keyExtractor={(item, index) => index.toString()}
          />

Итак, моя проблема в том, что я хочу визуализировать время из выбранных данных таким образом, чтобы с учетом даты дня. Например, вот журнал данных:

enter image description here, поэтому из этого атрибута "date_start" я должен убедиться, что дата совпадает в мой календарь, чтобы я мог отобразить это «9:30» Есть идеи, как я могу подойти к нему? Надеюсь, я достаточно ясно высказался и благодарю вас за ваши предложения

Ответы [ 2 ]

1 голос
/ 23 марта 2020

Вы можете просто использовать библиотеку типа Момент , чтобы определить дату и время вашего объекта, как показано ниже, 

let date = moment("2020-03-23 09:30").format('YYYY-MM-DD');
console.log(date)

let time = moment("2020-03-23 09:30").format('h:mm A');
console.log(time)

Для получения дополнительной информации проверьте Формат строки Момента.

Надеюсь, это поможет вам. Не стесняйтесь сомнений.

0 голосов
/ 23 марта 2020

Если вы хотите, чтобы пользователь мог выбирать дату и время для дня, официальная документация по реакции рекомендует использовать DateTimePicker

С этим вы будет иметь собственный компонент для отображения даты в IOS и Android.

...