RiotJS：如何在循環中緩存值？

我期望通過在RiotJS的each={}循環中緩存重複的值來提高性能和可讀性。有沒有辦法這樣做，不會產生價值和/或招致不必要的性能開銷？RiotJS：如何在循環中緩存值？

前：

<my-tag> 
    <p each="{item in data}"> 
    <b if="{item.style == 'b'}">{item.text}</b> 
    <i if="{item.style == 'i'}">{item.text}</i> 
    </p> 
    data = [ 
    {"text": "bold me", "style": "b"}, 
    {"text": "italicize me", "style": "i"} 
    ]; 
</my-tag> 

<!-- Renders <p><b>bold me</b></p> <p><i>italicize me</i></p> -->

後：

<my-tag> 
    <p each="{item in data}"> 
    {style=item.style} 
    {text=item.text} 
    <b if="{style == 'b'}">{text}</b> 
    <i if="{style == 'i'}">{text}</i> 
    </p> 
    data = [ 
    {"text": "bold me", "style": "b"}, 
    {"text": "italicize me", "style": "i"} 
    ]; 
</my-tag> 

<!-- Renders <p>b bold me <b>bold me</b></p> <p>i italicize me <i>italicize me</i></p> -->

jsfiddle

來源

2016-07-21 Luke Dennis

我認爲你要做到這一點：

<p each="{data}"> 
    <b if="{style == 'b'}">{text}</b> 
    <i if="{style == 'i'}">{text}</i> 
</p>

jsfiddle

來源

2016-07-26 05:01:16 Freez

這將不包括我的使用情況下，我在尋找更復雜的行爲：'{細胞= parent.row [column.key]} {cell.content}'等等。相當肯定」正確的「答案是使用預渲染函數重新構造數據以匹配DOM層次結構;我只是希望有一個乾淨的方式來做同樣的事情。 –

我明白了，我認爲將數據轉換爲更簡單的結構是個好主意。 – Freez

下有蟲子在2.5，但在next分支（3.0.0-alpha.5）的偉大工程：

<my-tag> 
    <p each="{item in data}"> 
    {(style=item.style) && false} 
    {(text=item.text) && false} 
    <b if="{style == 'b'}">{text}</b> 
    <i if="{style == 'i'}">{text}</i> 
    </p> 
    data = [ 
    {"text": "bold me", "style": "b"}, 
    {"text": "italicize me", "style": "i"} 
    ]; 
</my-tag>

因爲表達式的計算結果爲假，不渲染，但style和text的值仍然設置。

來源

2016-07-28 01:50:29

RiotJS：如何在循環中緩存值？

回答

相關問題