Question

当您在管理员设置中设置默认视图，并且您已检查多个视图以供用户切换时，默认视图不会突出显示为“活动”。

为了达到这个目的，在先前版本的Telescope中（在RefactorScope之前）我修改了文件client/components/menu/menu_component.js添加这个（我将TOP作为我的默认视图，所以我可耻地硬编码了它）：

if (currentPath === "/" && getRoute(this) === "/top") {
  itemClass += " item-active"
}

据我所知，编辑Telescope源文件并不明智，但它是最快捷，最简单的解决方案。现在，在大型望远镜重构之后，我想以正确的方式做到这一点。

但最终的问题是，有什么方法可以做到这一点？

Answer 1

在Telescope源码中进行了一些挖掘之后，我找到了这个解决方案：

使用以下内容在自定义包中创建名为custom_view_menu.js的文件：

getRoute = function (item) {
  // if route is a Function return its result, else apply Router.path() to it
  return typeof item.route == "function" ? item.route() : Router.path(item.route);
}

Template.menuItem.helpers({
  itemClass: function () {
    var itemClass = "";
    var currentPath = Router.current().location.get().path;

    if (this.adminOnly) {
      itemClass += " item-admin";
    }
    if (getRoute(this) === currentPath || getRoute(this) === Meteor.absoluteUrl() + currentPath.substr(1)) {
      // substr(1) is to avoid having two "/" in the URL
      itemClass += " item-active";
    }
    if (this.label === Settings.get("defaultView") && currentPath === "/") {
      itemClass += " item-active";
    }
    if (this.itemClass) {
      itemClass += " "+this.itemClass;
    }

    return itemClass;
  }
});

从原始来源（https://github.com/TelescopeJS/Telescope/blob/master/packages/telescope-core/lib/client/templates/menu/menu_component.js）复制的必需品添加了此剪辑：

if (this.label === Settings.get("defaultView") && currentPath === "/") {
  itemClass += " item-active";
}

我希望它会帮助某人而我并不是唯一一个尝试这样做的人：）

在Telescope应用程序中突出显示默认视图

1 个答案: