如何更改用户菜单面板中与按钮关联的链接

开发
1

与其让高亮按钮指向 u/miles/summary，我更希望它指向 u/miles/activity。我该怎么做？我尝试在网上查找（似乎需要用 JavaScript 更改 data-url 属性，但我看到的方法都需要先获取元素的 ID，而这个元素并没有 ID。）

PIC
PIC1920×1080 480 KB

1 个赞
2

您需要在一个主题组件中重新打开相关的部件，类似如下：

api.reopenWidget("user-menu-links", {
  profileGlyph() {
    return {
      title: Titles["profile"],
      className: "user-preferences-link menu-link",
      id: QuickAccess.PROFILE,
      icon: "user",
      action: UserMenuAction.QUICK_ACCESS,
      actionParam: QuickAccess.PROFILE,
      data: { url: `${this.attrs.path}/activity` },
      role: "tab",
      tabAttrs: this._tabAttrs(QuickAccess.PROFILE),
    };
  },
})
3 个赞
3

谢谢！我想这说得通。
不过有一点，我将其放入 </head> 中，但遇到了错误：SyntaxError: unknown: Unexpected token, expected "," (28:6)

<script type="text/discourse-plugin" version="0.8">    
    api.reopenWidget("user-menu-links", {
      profileGlyph() {
        return {
          title: Titles["profile"],
          className: "user-preferences-link menu-link",
          id: QuickAccess.PROFILE,
          icon: "user",
          action: UserMenuAction.QUICK_ACCESS,
          actionParam: QuickAccess.PROFILE,
          data: { url: `${this.attrs.path}/activity` },
          role: "tab",
          tabAttrs: this._tabAttrs(QuickAccess.PROFILE),
        };
      },
    }
</script>
1 个赞
4

上面缺少一个闭合的括号，已更新。

2 个赞
6

现在没有错误了，但是……现在它导致用户菜单链接的下拉菜单根本无法打开。你知道是什么原因吗？

1 个赞
7

你是如何调试它的？

查看浏览器中的 JavaScript 控制台总是一个不错的起点。

如果你仔细查看，会发现最终有三个明显的问题。

在这种情况下，解决方案非常简单：你只需提供缺失的常量即可：

      const UserMenuAction = {
        QUICK_ACCESS: "quickAccess",
      };

      const QuickAccess = {
        BOOKMARKS: "bookmarks",
        MESSAGES: "messages",
        NOTIFICATIONS: "notifications",
        PROFILE: "profile",
      };
      
      const Titles = {
        bookmarks: "user.bookmarks",
        messages: "user.private_messages",
        notifications: "user.notifications",
        profile: "user.preferences",
      };

一旦你从原始源代码中添加这些内容，问题就解决了 :tada:

（但请注意 Faizaan 在下文中提出的优化方案，它消除了对这些常量的需求，效果更佳 :)）

2 个赞
8

更简单的方式

<script type="text/discourse-plugin" version="0.8">    
api.reopenWidget("user-menu-links", {
  profileGlyph() {
   const glyph = this._super(...arguments);
   glyph['data'] = { url: `${this.attrs.path}/activity` };
   return glyph;
  },
}

不过尚未测试 :wink:

3 个赞
9

没错，这样好多了，而且避免了使用常量——不错的优化！:slight_smile:

3 个赞
10

实际上，你可以更进一步，直接省略它：

      api.reopenWidget("user-menu-links", {
        profileGlyph() {
         const glyph = this._super();
         glyph['data'] = { url: `${this.attrs.path}/activity` };
         return glyph;
        }
      });

因为这里没有参数。

3 个赞
11

谢谢大家！运行完美。我也学到了很多关于编辑 Discourse 的知识！

2 个赞