Question

我在Meteor应用程序中有一个表单，其中包含一个可由Bootstrap手风琴访问的单选按钮列表。我在meteor中实现了一个验证路由，它将类插入到输入元素中，以将它们标记为有效/无效。

问题是：每当一个输入元素的验证状态发生变化时，模板就会重新绘制，当前打开的手风琴会关闭。

我通过这种笨拙的方法解决了这个问题：

Meteor.startup(function() {
    // track collapse state of accordion....
$('.collapse').on('shown', function() {
    Session.set(addBookingCollapse, $(this).attr('id'));
});
});

Template.addrecord.helpers({
    openAccordion: function(accordion) {
        if (Session.get(addBookingCollapse) == accordion) {
            return 'in'
        };
    }
});

<div id="collapseOne" class="accordion-body 
collapse {{openAccordion 'collapseOne'}}">

......等等其他四个可折叠元素

但是无论谁为了这个缘故，必须有一个更优雅的解决方案？我不想为此浪费会话变量....

Answer 1

将输入元素放在{{#isolate}}{{\isolate}}块中有助于避免重新呈现整个模板。请参阅：Meteor Isolates

Answer 2

我还没有真正关注你的代码/问题，但你为什么要使用id来自己定位每个？为什么不像这样使用所有类的类：

$('.a-class-that-you-name').on('shown', function() {
    var thisSpecificId = $(this).attr('id');
    Session.set('addBookingCollapse', thisSpecificId);
});

那会有用吗？

流星，表格验证和Bootstrap手风琴

2 个答案: