Ractive.js继续和中断循环

Question

我有一个要反复浏览的清单：

<ul>
    {{#list}}
    <li>{{this.value}}</li>
    {{/list}}
</ul>

如果{{this.hidden}}为真，我将如何继续循环？

我想做这样的事情：

{[#if this.hidden]} {[continue]} {[/if]}

RactiveJS有可能吗？

Answer 1

我不相信有一个break或continue语句（或等价的东西）的Ractive小胡子，至少根据其文档。 您仍然可以达到相同的效果。

无需根据某些条件continue ，只需处理相反的条件即可。

{[#if !this.hidden]} {[do whatever...]} {[/if]}

无需break循环，而是在绑定之前过滤数组。

var listModified = [];
for (var i=0; i < ractive.get("list").length; i++) {
    if (/* some condition */)
        break;
    listModified.push(ractive.get("list")[i]);
}

Answer 2

您可以创建一个计算属性，该属性返回一个数组，该数组将忽略那些隐藏的数组。 假设列表是对象列表：

将此添加到您的配置：

computed: {
  listWithoutHidden: function(){
    return this.get('list').filter(function(item){
      return !item.hidden;
    });
  }
}

并更新模板

<ul>
    {{#listWithoutHidden}}
    <li>{{this.value}}</li>
    {{/list}}
</ul>