首页 > 解决方案 > 我如何操作这些数据以使 UI - React Native 可以接受?

问题描述

我有一个约会应该根据早上/晚上的时间进行。所以在后端人员制作 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',
      ],
    },
  ],
};

这是设计的结果

但是在后端人员制作 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',
        },
      ],
    },
  ],
};

但是这样一来,我就无法像UI with Animation一样处理它可以接受了,而且我还有一个重复的代码!

那么我该如何处理这个代码,就像他的回应的第一种方式一样?

这是一个代码片段 ,请检查评论以理解我的意思

标签: javascriptreactjsreact-native

解决方案


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);


推荐阅读