Reaktivität, Isolation und Listen
Es gibt etwas an der Reaktivität, das ich einfach nicht verstehe, insbesondere bei Listen. Mein Problem lässt sich am einfachsten anhand des Leaderboard-Beispiels modellieren (meteor --create example leaderboard)
Fügen Sie dies zunächst der clientseitigen js hinzu (wie unterhttp://listtest.meteor.com/):
Template.player.rendered = function () {
console.log('Player rendered');
}
... und beobachten Sie dann die Konsole, während Sie die App ausführen. Wenn Sie den ausgewählten Wissenschaftler wechseln, werden Sie das bemerkenjeder Der Player wird neu gerendert, auch wenn dies nicht erforderlich ist.
Dank einiger Hilfe im IRC habe ich festgestellt, dass das #Unter-Template oder das #Isolieren des unteren Teils des Haupt-Templates wie folgt funktioniert (und umhttp://listtest2.meteor.com/ behebt die ineffizienz. Mit anderen Worten, wenn ein anderer Spieler ausgewählt wird, werden nur zwei Spieler neu gerendert: der neu ausgewählte und der abgewählte.
<head>
<title>Leaderboard</title>
</head>
<body>
<div id="outer">
{{> leaderboard}}
</div>
</body>
<template name="leaderboard">
<div class="leaderboard">
{{#each players}}
{{> player}}
{{/each}}
</div>
{{#isolate}}
{{#if selected_name}}
<div class="details">
<div class="name">{{selected_name}}</div>
<input type="button" class="inc" value="Give 5 points" />
</div>
{{/if}}
{{#unless selected_name}}
<div class="none">Click a player to select</div>
{{/unless}}
{{/isolate}}
</template>
<template name="player">
<div class="player {{selected}}">
<span class="name">{{name}}</span>
<span class="score">{{score}}</span>
</div>
</template>
Meine Frage lautet: Warum verursacht das Isolieren eines anderen Teils einer Vorlage aanders Verhalten von Subtemplate ändern?
Vielen Dank.