Question

我在meteorjs项目中使用铁路由器。我使用after：handler来设置一个显示或隐藏传单映射的会话变量。我不能像往常一样将地图放在我的模板中，因为meteorjs会消除地图div和它的状态。

现在我正在添加引导菜单和下拉列表，这些菜单和下拉列表构建为带有href =“＃”的锚标签，如下所示：

<ul class="nav nav-pills">
    <li class="active"><a href="#">Home</a></li>
    <li><a href="#">Profile</a></li>
    <li class="disabled"><a href="#">Disabled</a></li>
</ul>

单击这些菜单不会留下网址，但会导致铁路由器在每次点击或子菜单下钻时调用我的after：handler。

有没有办法防止这种情况发生？这对我的项目没有害处，但似乎不洁净。

Answer 1

单击#link链接时可以阻止默认行为。

Router.configure({
  layoutTemplate: 'appLayout'
  ...
});

如果你的布局是appLayout

Template.appLayout.events({
  "click [href=#]": function(e) {
    e.preventDefault();
  }
});

Answer 2

路由器拦截所有链接点击以便正常工作，所以这不是一件容易的事情（我猜也不是一个好主意）来阻止它。

您可以通过将地图正常放置在模板中，但在a constant block内解决问题。无论何时进行自定义DOM操作，它们都很有用。

Answer 3

默认情况下iron-router会附加到选择器a[href]的链接。我发现这不能很好地工作（特别是使用bootstrap插件）并开发了一个修复程序https://github.com/EventedMind/iron-router/pull/324

您可以像这样修改链接选择器：

if (Meteor.isClient){
  IronLocation.configure({
    linkSelector: "a[href][data-iron]"
  });
}

使用此设置，铁路由器只会选择具有data-iron属性的链接。

另一种方法是尝试绑定a[href="#"]并在event.stopPropagation()链接处理程序到达之前调用iron-router。

Answer 4

只需使用ian:bootstrap-3

即可

这将适用于默认的铁路由器

meteor add ian:bootstrap-3

流星铁路由器和空链接标签

4 个答案: