0
我在我的Meteor web應用程序中使用官方語義ui軟件包,每當我嘗試瀏覽垂直菜單時都會出現此錯誤。這導致我的流量路由器行爲不起來而不顯示。因此,殺死了我的移動體驗:(但一切都運行完美的桌面不能在'Node'上執行'insertBefore'MeteorJS
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進行造型。這可能會導致一些問題,但我不確定。