我通过使用箭头函数而没有使用花括号,完美地将我的对象数据渲染到DOM中。
当我尝试在同一箭头函数后添加花括号时,DOM不会呈现任何数据。
CODE WORKS WITHOUT CURLY BRACES AFTER ARROW FUNCTION
function displayMatches () {
const matchArray = findMatches(this.value, cities)
console.log(matchArray)
const html = matchArray.map(place =>
`<li>
<span class="name">${place.city}, ${place.state}</span>
<span class="population">${place.population}</span>
</li>`
).join('')
suggestion.innerHTML = html
}
THE SAME CODE BREAKS WITH CURLY BRACES AFTER ARROW FUNCTION
function displayMatches () {
const matchArray = findMatches(this.value, cities)
console.log(matchArray)
const html = matchArray.map(place => {
return
`<li>
<span class="name">${place.city}, ${place.state}</span>
<span class="population">${place.population}</span>
</li>`
}).join('')
suggestion.innerHTML = html
}