Question

我希望通过在RiotJS each={}循环期间缓存重复值来提高性能和可读性。有没有办法这样做不会产生价值和/或产生不必要的性能开销？

在：

<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

Answer 1

我想你想这样做：

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

jsfiddle

Answer 2

以下是2.5上的错误，但在next分支（3.0.0-alpha.5）上运行良好：

<html ...>
  <f:metadata>
   <f:viewParam name="entidad" value="#{grupoView.idEntidad}"/>
  </f:metadata>

<body>

由于表达式的计算结果为false，因此它们不会呈现，但<my-tag> {(style=item.style) && false} {(text=item.text) && false} {text} {text} data = [ {"text": "bold me", "style": "b"}, {"text": "italicize me", "style": "i"} ]; </my-tag>和style的值仍然会设置。

RiotJS：如何在循环期间缓存值？

2 个答案: