私はreact-varを使用しています。現在、以下のイベントはクリックされたときに非表示のdivを表示して非表示にします。いくつかのオプションがあるので、以下のイベントを変更して開いているdivを非表示にして、クリックしたものだけを表示したいと思います。どのように私はそれを書くだろうか?開いている要素をすべて閉じる
パス:templates.html
<template name="jobOfferLayout">
{{#each jobOffers}}
{{> jobOfferCard}}
{{/each}}
</template>
<template name="jobOfferCard">
<div class="list-group">
<a class="list-group-item smallInfo">
<h4 class="list-group-item-heading">{{jobs}}</h4>
</a>
</div>
{{#if showFullContent}}
<div class="bigInfo">
Show big info
</div>
{{/if}}
</template>
はパス:jobOfferCard.js
Template.jobOfferCard.onCreated(function(){
this.showFullContent = new ReactiveVar(false);
});
Template.jobOfferCard.helpers({
showFullContent: function(){
return Template.instance().showFullContent.get();
},
});
Template.jobOfferCard.events({
"click .smallInfo": function(event, template){
template.showFullContent.set(!template.showFullContent.get());
},
});
は、あなたがやりたい、実際にどのような詳細情報を提供してくださいできますか? –
を隠す/表示するために炎を使用することができます
UPDATE
–私は上記の情報を追加しました。ジョブのリストがあり、各ジョブにはジョブカードがあります。現在、ジョブをクリックすると、リンクされているカードが開きます。私が抱えている問題は、複数のジョブをクリックして複数のカードを開いてしまった場合です。私は新しい仕事が開いているときにカードを閉じたい。 – bp123