如何使用UI - React Native操作此数据以使其可接受？

Question

我有一个约会，应该根据上午/晚上的时间进行。所以在后台开发API之前，我是这样模拟它的

const Data = {
  day: 'Wed 22-5-2020',
  appointments: [
    {
      name: 'morning time',
      sets: 5,
      dates: [
        '8-9 am',
        '9-10 am',
        '10-11 am',
        '11-12 am'],
    },
    {
      name: 'evening time',
      sets: 5,
      dates: [
        '12-01 pm',
        '01-02 pm',
        '02-03 pm',
        '03-04 pm',
      ],
    },
  ],
};

这是design的结果

但是在后台的家伙做了一个API之后，我得到了这样的响应

const Data = {
  appointments: [
    {
      id: 1,
      day: 'Saturday',
      dates_morning: [
        {
          id: 10,
          time: '10 - 10:30 am',
          type: 'morning',
          name: 'morning time',
        },
      ],
      dates_evening: [
        {
          id: 13,
          time: '3 - 4 pm',
          type: 'evening',
          name: 'evening time',
        },
      ],
    },
  ],
};

但在这种情况下，我不能像动画用户界面那样处理它，而且我有一个重复的代码！

那么，我该如何处理这段代码，使其像他的第一种响应那样呢？

这是一个代码snippet查看评论请理解我的意思

Answer 1

Ciao，我认为你可以尝试按照这个例子来转换数据：

​

const Data_ko = {
  appointments: [
    {
      id: 1,
      day: 'Saturday',
      dates_morning: [
        {
          id: 10,
          time: '10 - 10:30 am',
          type: 'morning',
          name: 'morning time',
        },
      ],
      dates_evening: [
        {
          id: 13,
          time: '3 - 4 pm',
          type: 'evening',
          name: 'evening time',
        },
      ],
    },
  ],
};

const result = {};
result.day = Data_ko.appointments[0].day; // here it's difficult to translate Saturday into date!
result.appointments = [];
const morning_appointment = {};
morning_appointment.name = 'morning time';
// here I don't know what does it mean sets
morning_appointment.dates = [];
morning_appointment.dates = Data_ko.appointments[0].dates_morning.map(el => {
   return el.time;
});
const evening_appointment = {};
evening_appointment.name = 'evening time';
// here I don't know what does it mean sets
evening_appointment.dates = [];
evening_appointment.dates = Data_ko.appointments[0].dates_evening.map(el => {
   return el.time;
});
result.appointments.push(morning_appointment);
result.appointments.push(evening_appointment);

console.log(result);

​