Question

我正在使用官方语义ui包为我的Meteor网络应用程序，并在我尝试浏览垂直菜单时收到此错误。这导致我的flowrouter路由行为不稳定而不显示。因此，杀死我的移动体验:(。但是在桌面上一切都很完美。

Error: Failed to execute 'insertBefore' on 'Node': 
The node before which the new node is to be inserted is not a child of this node.

模板：

<template name="_nav">
  <div>
    <div class="ui grid large menu computer only">
      <div class="item">
        <img src="/cook.png" href="/">
      </div>
      <a href="/" class="item {{isActiveRoute name='home'}}">
        Home
      </a>
      <a href="/aboutus" class="item {{isActiveRoute name='aboutus'}}">
        About Us
      </a>
      <a href="/team" class="item {{isActiveRoute name='team'}}">
        Team
      </a>
      <a href="/contacts" class="item {{isActiveRoute name='contacts'}}">
        Contacts
      </a>
      <div class="ui large right menu">
        {{#if isInRole 'admin'}}
        <a href="/admin" class="item {{isActiveRoute name='admin'}}">
          Admin
        </a>
        {{/if}}
        <a class="ui item">
          {{> loginButtons}}
        </a>
      </div>
    </div>
  <div class="ui grid secondary menu mobile tablet only">
    <div class="ui container">
      <a class="item toggle-menu">
        <i class="big sidebar icon"></i>
      </a>
      <div class="ui sidebar vertical menu">
        <a href="/" class="item {{isActiveRoute name='home'}}">
          Home
        </a>
        <a href="/aboutus" class="item {{isActiveRoute name='aboutus'}}">
          About Us
        </a>
        <a href="/team" class="item {{isActiveRoute name='team'}}">
          Team
        </a>
        <a href="/contacts" class="item {{isActiveRoute name='contacts'}}">
          Contacts
        </a>
        {{#if isInRole 'admin'}}
          <a href="/admin" class="item {{isActiveRoute name='admin'}}">
          Admin
          </a>
        {{/if}}
      </div>
        <div class="ui secondary right menu">
          <a class="ui item">
            {{> loginButtons}}
          </a>
        </div>
      </div>
    </div>
  </div>
</template>

活动：

Template._nav.events({
  'click .toggle-menu': function () {
    $('.ui.sidebar')
      .sidebar('toggle');
  }
});

路线（FlowRouter）：

FlowRouter.route( '/' , {
  action: function() {
    BlazeLayout.render( '_app', {
      nav: '_nav',
      content: 'home',
      footer: '_footer'
    });
  },
  name: 'home'
});

FlowRouter.route( '/AboutUs' , {
  action: function() {
    BlazeLayout.render( '_app', {
      nav: '_nav',
      content: 'aboutus',
      footer: '_footer'
    });
  },
  name: 'aboutus'
});

FlowRouter.route( '/Team' , {
  action: function() {
    BlazeLayout.render( '_app', {
      nav: '_nav',
      content: 'team',
      footer: '_footer'
    });
  },
  name: 'team'
});

FlowRouter.route( '/Contacts' , {
  action: function() {
    BlazeLayout.render( '_app', {
      nav: '_nav',
      content: 'contacts_list',
      footer: '_footer'
    });
  },
  name: 'contacts'
});

FlowRouter.route( '/Admin' , {
  action: function() {
    BlazeLayout.render( '_app', {
      nav: '_nav',
      content: 'admin',
      footer: '_footer'
    });
  },
  name: 'admin'
});

CSS（如果重要的话）：

.ui.menu .active.item {
    background-color: #E0F1FF !important;
    color: Black !important;
}

.ui.dropdown.item {
  padding: 0;
}

.ui.dropdown.item:hover {
  background-color: rgba(0, 0, 0, 0.00) !important;
}

.ui.menu {
  margin: 0;
}

同样，只有当我尝试使用垂直菜单导航时，此错误才会显示。我也在使用sach：db-admin包，它是yogibens：admin包，但是用于FlowRouter。其中使用twbs：bootstrap进行样式设计。这可能会导致一些问题，但我不确定。

Answer 1

尝试在{{#each}}或{{#if}}字段周围放置容器（或其他）。这是在meteor的github页面上报告的问题。替换块的东西。

https://github.com/meteor/meteor/issues/2373

无法在'Node'MeteorJS上执行'insertBefore'

1 个答案: