خطأ في استخدام {{didInsert}} في مكون موصل: "لا يمكن استدعاء مُنشئ الفئة DidInsertModifier بدون 'new'"

[jahan_gagan]

مرحباً بالفريق،

أعمل على مكون سمة مخصص وأحاول استخدام مكون موصل عبر منفذ الإضافة kanban-card-bottom. داخل مكون الموصل هذا، أرغب في تشغيل منطق DOM بعد العرض باستخدام المُعدِّل {{didInsert}}.

ومع ذلك، بمجرد إضافة {{didInsert this.modifyElement}} في القالب، أحصل على الخطأ التالي في وحدة تحكم المتصفح:

Uncaught (in promise) TypeError: Class constructor DidInsertModifier cannot be invoked without 'new'
    at FunctionHelperManager.getValue (index.js:214:86)

إعداد المكون الخاص بي:

// javascripts/discourse/connectors/kanban-card-bottom/replace-last-post-by.gjs
import Component from "@glimmer/component";
import { action } from "@ember/object";
import didInsert from "@ember/render-modifiers/modifiers/did-insert";

export default class ReplaceLastPostBy extends Component {
  @action
  modifyElement(element) {
    console.log("Element ====> ", element);
  }

  <template>
    {{didInsert this.modifyElement}}
  </template>
}

الهدف:
أريد ببساطة استهداف عنصر DOM بعد العرض من مكون الموصل هذا (على سبيل المثال، استبدال اسم مستخدم بصريًا).

أي رؤى ستكون موضع تقدير!

لقطة شاشة للخطأ

شكراً،

[david (David Taylor)]

يبدو أن هناك بعض التعليمات البرمجية المفقودة في مثالك؟ أتوقع رؤية <template> / </template>، وأن يتم إرفاق المعدِّل بعنصر مثل

<template>
  <div {{didInsert this.modifyElement}}>
    ...
  </div>
</template>