循環內的Riot-tag

我有一個xxx組件，當與riot-tag屬性和標準HTML5標記一起使用時，它可以正常工作：<article riot-tag="xxx"></article>。但是，當我在循環內部使用riot-tag屬性時，標記爲空：<article each="{xxxTags}" riot-tag="{xxx}"></article>。在一個循環中是否可以使用riot-tag？我怎樣才能使它工作？循環內的Riot-tag

附加說明：

我不得不產生幾種不同的，雖然類似的組件一個接一個。所以，我有一個數組來存儲它們：

var xxxTags = [{tag: 'xxx'}, {tag: 'yyy'}, {tag: 'zzz'}];

手動對所有的把任何textareas逐一：XXX，YYY，ZZZ工作正常，併產生各個部件。但是，當我嘗試使用each時，它們最終會在chrome devtools中爲空（無子），但與其他手動方式相同。

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <meta charset="utf-8"> 
 
    <title>JS Bin</title> 
 
</head> 
 
<body> 
 
    
 
<my-tag></my-tag> 
 

 
<!-- inlined tag definition --> 
 
<script type="riot/tag"> 
 
    <my-tag> 
 
    /*Standard, manual addition of different components (works)*/ 
 
    <xxx></xxx> 
 
    <yyy></yyy> 
 
    <zzz></zzz> 
 
    /*Standard addition of same components in a loop (works)*/ 
 
    <div each={myTags}>{tag}</div> 
 
    <br> 
 
    /*Addition of different components with "riot-tag" manually (works)*/ 
 
    <div riot-tag="xxx"></div> 
 
    <div riot-tag="yyy"></div> 
 
    <div riot-tag="zzz"></div> 
 
    /*Addition of different components with "riot-tag" in a loop (DOESN'T WORK should look like the example above)*/ 
 
    <div each={myTags} riot-tag="{tag}"></div> 
 
    
 
    this.myTags = [{tag: 'xxx'}, {tag: 'yyy'}, {tag: 'zzz'}]; 
 
    </my-tag> 
 
    
 
    <xxx> 
 
    <p>X content</p> 
 
    </xxx> 
 
    
 
    <yyy> 
 
    <p>Y content</p> 
 
    </yyy> 
 
    
 
    <zzz> 
 
    <p>Z content</p> 
 
    </zzz> 
 
</script> 
 

 
<!-- include riot.js and the compiler --> 
 
<script src="//cdn.jsdelivr.net/g/[email protected](riot.min.js+compiler.min.js)"></script> 
 

 

 
<!-- mount normally --> 
 
<script> 
 
    riot.mount('*'); 
 
</script> 
 
</body> 
 
</html>

來源

2015-11-02 jalooc

好，看起來，像riot-tag屬性的標籤不安裝當與每個 -loop生成（仍然看起來像一個錯誤？）。對於上面提到的代碼，添加這樣做的工作：

this.on('mount', function() { 
    for(var i = 0; i < this.myTags.length; i++) riot.mount(this.myTags[i].tag); 
});

來源

2015-11-03 08:46:45 jalooc

循環內的Riot-tag

回答

相關問題