JavaScript Array.map（）将逗号附加到DOM

Question

我试图从here渲染一些彩票结果。 我得到的所有数据都很好，但是想要将winsnumbers，mega_ball和multiplier值组合起来渲染到这样的页面：

相反，我得到的是数字，但是使用逗号呈现给DOM，如下所示：

const url = 'https://data.ny.gov/resource/h6w8-42p9.json';

$.get(url, (data) => {
// Deconstruct Array Data
[latest, one, two, three] = data;

const pastResults = [one, two, three]

// Removed A Block of CODE for StackOverflow dealing with latest result since it works fine.

pastResults.map(num => {

  const numsArray = num.winning_numbers.split(" ");
  numsArray.push(num.mega_ball);
  numsArray.push("x" + num.multiplier.split("")[1]);
  console.log(numsArray);

  pastResultsBlock.append(`
    <div class="col-12">
      <div class="animated flipInY past-result-item box-shadow">
        <div class="past-result-date">${moment(num.draw_date).format("MMM Do")}</div>
        <div class="past-result-numbers">
          ${numsArray.map(number => `<span>${number}</span>`)}
        </div>
      </div>
    </div>
    `)
  })

})

在控制台中阵列看起来很好。但是当它在DOM中呈现时，会出现一个＆＃34;，＆＃34;每个人后都逗号...

非常感谢任何帮助和反馈。

以下是一个JSFiddle链接以防万一。 JSFiddle

Answer 1

只需明确加入它们，而不是依赖默认的Array::toString方法。

// Change
`...${numsArray.map(number => `<span>${number}</span>`)}...`
// to
`...${numsArray.map(number => `<span>${number}</span>`).join("")}...`