JS 无法再用于主题组件

开发
1

继续讨论 A little help with a CSS selector?：

你好，

不久前我创建了这个主题，用于信任级别的 CSS 选择器的 JavaScript 曾经奏效。现在它不再奏效了。这是 JS…


import { apiInitializer } from "discourse/lib/api";

export default apiInitializer((api) => {
  const allowedGroups = ["trust_level_4"]; // 添加您要定位的组
  const includeUsersField = ["username"]; // 使用 "id" 或 "username"

  api.modifyClass("component:chat/message/info", (SuperClass) => {
    return class extends SuperClass {
      @service currentUser;

      get usernameClasses() {
        if (!this.currentUser) {
          return super.usernameClasses;
        }
        const allowedGroupClasses = this.currentUser.groups
          .filter((g) => allowedGroups.includes(g.name))
          .map((g) => `group--${g.name}`);

        const extraClasses = [
          ...allowedGroupClasses,
          ...includeUsersField.map((f) => `user--${this.currentUser[f]}`),
        ]
          .filter(Boolean)
          .join(" ");

        return super.usernameClasses + " " + extraClasses;
      }
    };
  });
})

这是我之前使用的 CSS…

.chat-message-info__username.group–trust_level_4 {
.chat-message-info__username__name {
color: blue;
}
}

有什么办法可以修复它吗？

特别是，是否有我应该知道的 Discourse 更新，或者这与 tl4 不是主要组有关吗？

谢谢！

2

只需导入服务装饰器即可正常工作：

import { service } from "@ember/service";

添加此项后，您的 @service currentUser 将再次正确加载。

3 个赞
3

编辑：我把它放进了脚本里，但仍然无法正常工作。

4

您能否分享一下浏览器控制台中的任何错误？这可能会有所帮助。

5

您能否在删除现有 CSS 后尝试添加以下 CSS？

.chat-message-info__username.group--trust_level_4 .chat-message-info__username__name {
  color: blue !important;
}