想要添加 class 或添加 font-style: italic, 到 map() 中的特定项目

Question

我正在使用 papaParse 将 CSV 文件转换为 JSON。我想弄清楚的是，如果 data.piece 具有“组合”的 data.type，如何仅将其斜体化。

我的 console.log 有效，但我还没有想出如何正确实施我想要的 DOM 操作。


      function init() {
        Papa.parse(public_spreadsheet_url, {
          download: true,
          header: true,
          complete: showInfo
        })
      }

      window.addEventListener('DOMContentLoaded', init)


      function showInfo(results) {
        var data = results.data

        let dataTypeComposition = (data.map(data=> {if (data.type == "Composition") {
        console.log(data.piece)
     }})) 

        let allData = (data.map(data => `<div class="past-performances"> <div class="datesAndLocations"> <p class="dates"> ${data.date}</p> <p class="locations"> ${data.location} </p></div> <div class="piecesAndDescripts"> <p class="pieces">${data.piece}</p> <p class="descriptions"> ${data.description} </p></div> <br></div>`))
    

    


      document.getElementById("list-container").innerHTML = allData.join(" ")
      } ```

Answer 1

您可以在地图的 return 中设置条件。为了清楚起见，我添加了缩进，并删除了一些无关的括号。

function init() {
  Papa.parse(public_spreadsheet_url, {
    download: true,
    header: true,
    complete: showInfo
  })
}

window.addEventListener('DOMContentLoaded', init)


function showInfo(results) {
  const data = results.data

  const allData = data.map(data =>
    `<div class="past-performances">
      <div class="datesAndLocations">
        <p class="dates">${data.date}</p>
        <p class="locations">${data.location}</p>
      </div>
      <div class="piecesAndDescripts">
        <p class="pieces">
          ${data.type === 'Composition' ? `<i>${data.piece}</i>` : data.piece}
        </p>
        <p class="descriptions">${data.description}</p>
      </div>
      <br>
    </div>
  `)

  document.getElementById("list-container").innerHTML = allData.join(" ")
}

想要添加 class 或添加 font-style: italic, 到 map() 中的特定项目

Want to add either class, or add font-style: italic, to specific items in map()

javascript

dictionary

dom-manipulation

papaparse