javascript - Riot.jsタグを特定の回数繰り返す方法は?

Question

タグを5回繰り返すだけです。ドキュメントを読みましたが、次のようなことを行う方法がわかりませんでした。

<some-tag>
   <star repeat={5} />
</some-tag>

私はこの醜い方法だけを見つけました：

<some-tag>
   <star each={stars} />

   this.stars = new Array(5);
</some-tag>

Answer 1

ソースを調べた後、これはあなたの興味を引くかもしれません。

この属性を使用する予定がある場合eachは、 riot が に渡す何らかの配列を定義する必要がありますforEach。

このjsfiddleは別のアイデア (最適ではありません) ですが、要点を示していると思います。別の解決策は、Riot のmixinシステムを使用して何らかのrepeat属性を構築することです。

https://jsfiddle.net/aunn3gt0/2/

<yield/>タグを使用してみるまでは、これは優れたソリューションです。その後、調整が必要になる場合があります。仕組みは次のとおりです。

var repeat = {
  init: function() {
    var repeats = [],
        count = this.opts.repeat

    this.on('mount', function() {
      if (!count) return

      var impl = this.root.innerHTML
      this.root.removeAttribute('repeat')

      while(repeats.length < count) {
        var clone = this.root.cloneNode()
        this.root.parentNode.insertBefore(clone, this.root)
        clone.innerHTML = impl
        repeats.push(riot.mount(clone))
      }
    })

    this.on('unmount',function(){
      repeats.forEach(function(tag,i){
        tag.unmount()
      })
    })

  }
}

次に、それを添付してthis.mixin(repeat)、期待どおりに使用します。

<tag repeat="10">Repeated 10 times.</tag>