משתנה במעקב לא נמצא?

זה הקוד שלי:

import { apiInitializer } from "discourse/lib/api";
import { iconNode } from "discourse-common/lib/icon-library";
import { tracked } from "@glimmer/tracking";

export default apiInitializer((api) =
> {
  @tracked iconName = settings.category_lock_icon || 'lock'; // גיבוי ל-'lock' אם ההגדרה אינה מוגדרת
  @tracked lockIcon = iconNode(this.iconName);

באופן מתסכל, קונסולת הדפדפן אומרת לי ש-ReferenceError: iconName is not defined. כשמסתכלים על הקובץ בכלי הפיתוח של הדפדפן, כך הוא נראה:

iconName = settings.category_lock_icon || 'lock'; // Fallback to 'lock' if setting is not defined
lockIcon = (0, _iconLibrary.iconNode)((void 0).iconName);

זאת, בהשוואה לקומפוננטה אחרת שיצרתי שמשתמשת במשתנים עקיבים (שעובדת):

#buttonIcon = (() =
> (dt7948.i(this, "buttonIcon"), void 0))();

, כאשר הקוד המקורי הוא

@tracked buttonIcon = localStorage.getItem('buttonIcon') != null ? localStorage.getItem('buttonIcon') : "bug";

האם אני עושה משהו לא בסדר?

אין צורך לעקוב אחריהם. הם יהיו קבועים ולכן מיותרים. אתה צריך לעקוב רק אחר דברים שיהיו דינמיים ושעבורם תרצה להפעיל גטרים. השתמש ב-DIcon במקום זאת.

אני מבין. תודה על העזרה; אנסה את זה.

בכל פעם שאתה עוקב אתה משתמש במשאבים אז שמור על זה למינימום. זה לא עניין גדול אבל זו פרקטיקה טובה לא לעקוב אם משהו לא ישתנה במהלך ביקור בדף. אני בטוח שאתה יכול לצפות לרענון דף אחד בין שינויי הגדרות.

תודה על העצה! אזכור זאת.

היי @merefield, אני לא מצליח להבין איך לעבור את הפונקציה הזו:

function ifProtected() {
  if(category.read_restricted) {
    return this.lockIcon;
  }
}

יש לך עצה איך אוכל להחזיר את זה? מכיוון שזה בקובץ .gjs, האם אפשר להחזיר

return <template>{{icon this.iconName}}</template>

?