React — JS переместить свойство внутри массива в качестве основного свойства

#javascript #reactjs

#javascript #reactjs

Вопрос:

У меня есть этот массив данных, и я хочу переместить свойство y как одно из основных свойств

 const [data,setData] = useState[{
  id: 1,
  color: '#756083',
  schedules: [
    {
      start: '2019-01-10',
      y: 0,
    },
    {
      start: '2019-02-10',
      y: 0,
    },
    {
      start: '2019-03-10',
      y: 0,
    },
  ],
},
{
  id: 2,
  color: '#756083',
  schedules: [
    {
      start: '2019-01-10',
      y: 1,
    },
    {
      start: '2019-02-10',
      y: 1,
    },
    {
      start: '2019-03-10',
      y: 1,
    },
  ],
},]
 

вывод должен быть {id: 1, y: 0, color …} {идентификатор: 2, y: 1, цвет …}

Я пробовал это, данные внутри консоли правильные, но они не обновляют состояние.

   setData(data => {
    data.map(d => {
      const newData = d.schedules.map(s => {
        return {
          ...d,
          y: s.y,
        };
      });
      console.log(newData);
      return newData;
    });
  });
 

Комментарии:

1. Какова логика выбора y из schedules массива?

2. Вы ничего не возвращаете внутри переданного обратного setData вызова .

3. fwiw, я думаю, вам следует инициализировать свое состояние с помощью state в правильном формате, а не форматировать на setData

4. @HassanImam сложно объяснить, просто нужно было вывести его наружу, извините, как упоминалось в консоли. данные журнала работают, но не задают состояние.

5. @RameshReddy, пытался вернуть его, но я получаю 3 [array] 3 [array] 3 [array] и иногда возврат не изменяет состояние

Ответ №1:

 const data=[{
  id: 1,
  color: '#756083',
  schedules: [
    {
      start: '2019-01-10',
      y: 0,
    },
    {
      start: '2019-02-10',
      y: 0,
    },
    {
      start: '2019-03-10',
      y: 0,
    },
  ],
},
{
  id: 2,
  color: '#756083',
  schedules: [
    {
      start: '2019-01-10',
      y: 1,
    },
    {
      start: '2019-02-10',
      y: 1,
    },
    {
      start: '2019-03-10',
      y: 1,
    },
  ],
},]

const res = data.map(d => ({
   ...d,
   y: d.schedules[0].y,
   schedules: d.schedules.map(s => ({ start: s.start }))
}));
    
 console.log(res) 

 setData(data.map(d => ({
       ...d,
       y: d.schedules[0].y,
       schedules: d.schedules.map(s => ({ start: s.start }))
    })))