我们可以遍历RIOT的原语或对象数组，并随时随地创建/更新html元素。使用“每个”构造我们可以实现它。
- 创建数组-创建对象数组。
this.cities = [
{ city : "Shanghai" , country:"China" , done: true },
{ city : "Seoul" , country:"South Korea" },
{ city : "Moscow" , country:"Russia" }
];- 添加每个属性-现在使用“每个”属性。
<ul>
<li each = { cities } ></li>
</ul> - 迭代对象数组-使用对象属性迭代数组。
<input type = "checkbox" checked = { done }> { city } - { country }例子
以下是完整的示例。
custom7Tag.tag
<custom7Tag>
<style>
ul {
list-style-type: none;
}
</style>
<ul>
<li each = { cities } >
<input type = "checkbox" checked = { done }> { city } - { country }
</li>
</ul>
<script>
this.cities = [
{ city : "Shanghai" , country:"China" , done: true },
{ city : "Seoul" , country:"South Korea" },
{ city : "Moscow" , country:"Russia" }
];
</script>
</custom7Tag>custom7.htm
<html>
<head>
<script src = "https://cdnjs.cloudflare.com/ajax/libs/riot/3.13.2/riot+compiler.min.js"></script>
</head>
<body>
<custom7Tag></custom6Tag>
<script src = "custom7Tag.tag" type = "riot/tag"></script>
<script>
riot.mount("custom7Tag");
</script>
</body>
</html>预览效果：
作者：terry，如若转载，请注明出处：https://www.web176.com/riotjs/2187.html
支付宝 
微信 