"Сгладить" вложенный объект для таблицы данных - PullRequest
Новая
       20

"Сгладить" вложенный объект для таблицы данных

0 голосов
/ 10 июля 2020

Проблема

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

data=[
  {
    key: "value",
    anotherKey: "bar",
  },
  {
    key: "value",
    anotherKey: {
      "nestedKey": "nestedValue",
      "foo": "bar"
    },
  },
  {
    key: "value",
    anotherKey: "foo",
  },
]

Итак, в основном у меня есть массив объектов и некоторые объекты внутри могут содержать вложенные данные, которые также должны быть отображены в таблице.

Теперь, поскольку мне «разрешено» передавать только массив пар ключ / значение объекты в таблицу, это сломается.

Чего я пытаюсь достичь

Я хочу, чтобы вложенные объекты были визуализируемыми, чтобы они могли отображаться с помощью таблицы данных.

Что я пробовал 

const transformedData = data.map(d => {
  return Object.keys(d).forEach(key => {
    if (typeof key === "object") {
      d[key] = <p>{d[key]}</p>
    } 
  })
})

К сожалению, это вообще не сработало.

Я почти уверен, что очень усложняю здесь вещи, и буду признателен за любую помощь. Раньше я заглядывал в Google, но не нашел разумного ответа.

Спасибо!

1 Ответ

1 голос
/ 10 июля 2020

Вы двигались в правильном направлении, расширив ваше решение, я смог придумать это 

transformedData = data.map( v => {
    let d = {...v}
    Object.keys(d).forEach(key => {
        if (typeof d[key] === "object") {
            d[key] = Object.keys(d[key]).reduce((acc, nestedKey) => {
                return acc + '<p>' + nestedKey + ':' + d[key][nestedKey] + '</p>'
            }, '')
        }
    });
    return d;
})

Оно работает, но я уверен, что может быть лучшее решение, чем это.

...