在模板中添加的 html 字符串被视为字符串,而非 HTML
作者: kylebakerio创建于 2023年10月25日更新于 2023年11月12日
function Carousel(props) {
let images = props.images.split(",");
images.map(image => image.trim());
let mainImage = `<img src="${images[0]}"></img>`;
let minis = "";
images.forEach(imageUrl => {
minis = minis.concat(`<img class="mini" src="${imageUrl}"></img>`)
})
console.log('a', images, minis)
console.log(html`
<div class="carousel">
<div class="main">
<img src="${images[0]}"></img>
${mainImage}
<p class="description">
Tro rilata fundamenta tabelvorto ik, o pre frazo iometo interalie. Dum otek iliard malsupera il, pro gh neigi gentonomo. Aliam multe poste ke bio, bo aha jeso samideano. Usono laŭlonge si kuo, ju apud anstataŭ ligvokalo ial, ikso tempo ut nur. Mo alta numeralo eks, timi pebi frazetvortigo no nen. Anti neniu tuj so, kapabl respondeci prepozitivo op fri.
</p>
</div>
<div class="minis">
${minis}
</div>
</div>
`)
}
specifically, notice these children:
<img src="${images[0]}"></img>
${mainImage}
Even though they're identical input, one is converted to a string child, one is converted to a vdom object.内容来源: developit/htm