Как отобразить свойства объекта

Question

Я пытаюсь отобразить массив объектов со свойствами "x", чтобы отобразить эти свойства в html-таблице, для страницы системного отчета. Но он возвращает единственную строку со всеми свойствами и для всех объектов, поэтому он не позволяет мне стилизовать каждое из этих свойств ... идея состоит в том, чтобы установить "пробел между", чтобы показать под заголовком. OBS: с использованием response-js.

<Text style={styles.infos}>
      {Test.map(item => {
          let keys = Object.keys(item);
          return keys.map(key => item[key]);
      })}
</Text>

Пример того, как это работает: [{"a": "a", "b": "b", "c": "c"},{"d": "d", "e": "e", "f": "f"},{"g": "g", "h": "h", "i": "i"}] Ожидаемое: <div><p>a</p><p>b</p><p>c</p></div>, <div><p>d</p><p>e</p><p>f</p></div>, <div><p>g</p><p>h</p><p>i</p></div> Фактическое: <div><p>abcdefghi</p></div>

Answer 1

let arr = [{"a": "a", "b": "b", "c": "c"},{"d": "d", "e": "e", "f": "f"},{"g": "g", "h": "h", "i": "i"}];

let res = arr.map(a=> {return `<div>${ Object.keys(a).map(k => { return `<p>${a[k]}</p>` }) }</div>`})



console.log(res)

Answer 2

Вы можете присоединиться к массиву с '' пробелом после Object.keys()

<Text style={styles.infos}>
      {Test.map(item => (<p>{Object.keys(item).join('')}<p>))}
</Text>

let arr = [{"a": "a", "b": "b", "c": "c"},{"d": "d", "e": "e", "f": "f"},{"g": "g", "h": "h", "i": "i"}];

let res = arr.map(a=> Object.keys(a).join(''))

console.log(res)