0

我正在构建的应用程序在 sidenav 中将电子邮件帐户显示为下拉列表(或手风琴),如此所述。

多亏了UIkit 观察者,当数据在加载时存在时,下拉菜单可以正常工作。

代码看起来像这样(简化):

<div id="app_wrapper" data-uk-observe>
    <ul class="uk-nav uk-nav-side uk-nav-parent-icon" data-uk-nav data-uk-observe>
        {{#each mailAccounts}}
        <li class="uk-parent ct-mail-account-side-nav-entry">
            <a href="#">user@domain.tld</a>
            <ul class="uk-nav-sub">
                <li><a href="#"><i class="uk-icon-inbox"></i> Inbox</a></li>
                <li><a href="#"><i class="uk-icon-folder"></i> Sent</a></li>
                <li><a href="#"><i class="uk-icon-folder"></i> Trash</a></li>
                <li><a href="#"><i class="uk-icon-folder"></i> Spam</a></li>
            </ul>
        </li>
        <li class="uk-nav-divider"></li>
        {{/each}}
    </ul>
</div>

通过流星方法添加新帐户时,出现条目但下拉列表已死。只有当模板完全重新渲染时,它才会变得栩栩如生。这通常需要绕道到不存在菜单的其他页面。

  • 我怎样才能让观察者意识到变化?
  • 为什么观察者没有注意到变化并将它的魔法应用于新创建的条目?
  • 有没有办法手动将 JavaScript 下拉魔法分配给新创建的元素?

UIkit 版本:2.19.0

4

1 回答 1

0

Meteor 使用 ractive 变量在运行时修改 DOM。这意味着您的 mailAccounts 需要是一个 ractive 变量。有两种便宜的(就工作量而言)方法来实现这一点

  1. 将 mailAccounts 定义为会话变量
  2. 让 mailAccounts 成为集合的一部分

如果您不介意编写更多代码,还有第三种方法。使用 ractiveVar 包并将 mailAccounts 定义为 reactiveVar。

于 2015-04-19T05:06:20.647 回答