Array of object :
const users = [{ id: 1, name: "Sakura Miko" }, { id: 2, name: "Usada Pekora" }];
Convert to DOM :
const html = `<ul> ${users.map(user => `<li>${user.name}</li>`).join("")} </ul>`; console.log(html); // <ul> <li>Sakura Miko</li><li>Usada Pekora</li> </ul>
.join(“”)を忘れないようにしましょう。
Array.map(callback)はブラウザが読み込む際に、自動的に.toString()
を実行して”,”区切りのStringにしてしまいます。
DOM生成時、”, ”は入れたくないので、自分でglueを””に指定して文字列にします。
コメントを書く