Замена значений из JSON result на HTML и CSS

Question

Я постараюсь объяснить это как можно лучше. Есть результат JSON, который отделяет каждый абзац текста и отмечает их 0 или 1 (или даже 0,3 et c). Результаты Stringified на веб-интерфейсе также показывают эти числа. Есть ли способ заменить их и применить стили CSS на основе значения (0, 0,1 или 1)?

JSON:

RAW:

"content": [
          [
            0.0, 
            "Lorem ipsum dolor sit amet, consectetur adipiscing elit.", 
            []
          ], 
          [
            0.0, 
            "Lorem ipsum dolor sit amet, consectetur adipiscing elit.", 
            []
          ], 
          [
            1, 
            "Lorem ipsum dolor sit amet, consectetur adipiscing elit.", 
            []
          ]
        ], 
...

В интерфейсе я получаю:

0Lorem ipsum dolor sit amet, consectetur adipiscing elit.0Lorem ipsum dolor sit amet, consectetur adipiscing elit.1Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Я должен получить:

Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Lorem ipsum dolor sit amet, consectetur adipiscing elit.

С заменой 0 и 1 на html (и классы)

Answer 1

Вы должны просто иметь возможность отображать это содержимое и извлекать значения из каждого элемента, а затем отображать их.

data.content.map((item, i) =>
  <p key={i} className={ item[0] < 0.5 ? 'low-value' : 'high-value' }>{ item[1] }</p>
)

Затем вы можете использовать деконструктивное присваивание , чтобы сделать этот очиститель и присвоить каждому значению именованную локальную переменную.

data.content.map(([value, text, array], i) =>
  <p key={i} className={ value < 0.5 ? 'low-value' : 'high-value' }>{ text }</p>
)