javascript - Array .map() 返回 HTML [object Object]

Question

我正在尝试在 React 和 JavaScript 中制作简单的动画文本，我的问题是，在将数组与字母映射到 HTML 后，我得到的是 <span>[Object object]</span> 。 有人可以解释我做错了什么。

animation = () => {
  let text = document.querySelector(".hi");
  let leterArr = [...text.textContent];
  text.textContent = "";
  leterArr.map(char => {
    return (text.innerHTML += "<span>" +{char} +"</span>")
  })
}

Answer 1

React 将 {char} 翻译为对象。因此，当您将其与字符串连接时，对象将变为 [Object object]

用这个

animation = () => {
  let text = document.querySelector(".hi");
  let leterArr = [...text.textContent];
  text.textContent = "";
  leterArr.map(char => {
    return (text.innerHTML += `<span>${char}</span>`)
  })
}