I noticied that few plugin outlet like topic-list-after-title require raw.hbs file
I did search in the handlebars documentation, but I could see anything as raw hbs file.
I checked in the discourse code, plugin outlet like topic-list-after-title are defined as
{{raw-plugin-outlet name="topic-list-after-title"}}
while other plugins are defined as
{{plugin-outlet name="composer-fields-below" args=(hash model=model)}}
Q1. Is there any reason why some plugin plugin are defined in above way ( raw-plugin-outlet) ?
Also I noticied that in the raw.hbs file, the setupcomponent is not called as explained in this link
Q2. Is it so? I had also asked similar question regarding this.
أنا مهتم بهذا أيضًا. هل وجدت الإجابة بعد؟
sam
3 فبراير 2020، 1:06ص
3
القوالب الخام هي تحسين للأداء. تتوفر فقط ميزات عرض إمبر جزئية، وإزالة الميزات هي ما يجعلها أسرع.
لذلك نستخدم نمطًا مختلفًا هنا من أجل القابلية للتوسع. ليس لدينا دورة حياة إمبر الكاملة.
هل يوجد شيء مشابه لـ setupComponent(args, component) مع المنافذ الخام أيضًا؟ ماذا عن الخصائص المحسوبة؟ أود إجراء بعض الحسابات بناءً على البيانات الموجودة في السياق. كيف يمكنني القيام بذلك؟ لا أعرف حتى ما إذا كان اسم ملف .js.es6 المرافق الذي أنشأته صحيحًا. هل يجب أن أسميه .raw.js.es6؟
SetUpComponent not being called for topic list tags plugin outlet - #3 by net_deamon
https://github.com/paviliondev/discourse-events/blob/master/assets/javascripts/discourse/initializers/event-edits.js.es6#L74 https://github.com/paviliondev/discourse-events/blob/master/assets/javascripts/discourse/connectors/topic-list-after-title/topic-list-event-rsvp.raw.hbs#L5
لدي نفس السؤال.
هل من الممكن “توفير” قالب خام مع جافا سكريبت مقابلة كما في المكونات العادية، ضمن مكون سمة (Theme Component)؟
لدي حالة استخدام صعبة للغاية وأحتاج إلى إدارة الإجراءات لنقل الحجج مرة أخرى إلى أعلى سلسلة المكونات من قالب مدمج بعمق ضمن قائمة المواضيع.
لاحظت وجود عدة ملفات .hbr مع عناصر مكون جافا سكريبت مقابلة بشكل واضح في مصدر Discourse، لكنني لاحظت شيئًا غريبًا، على سبيل المثال:
merefield@development:~/discourse$ find . -type f -name "flat-button.*"
./app/assets/javascripts/discourse/app/templates/flat-button.hbr
./app/assets/javascripts/discourse/app/templates/components/flat-button.hbs
./app/assets/javascripts/discourse/app/components/flat-button.js
merefield@development:~/discourse$ find . -type f -name "topic-list-item.*"
./app/assets/javascripts/discourse/app/templates/mobile/list/topic-list-item.hbr
./app/assets/javascripts/discourse/app/templates/components/topic-list-item.hbs
./app/assets/javascripts/discourse/app/templates/list/topic-list-item.hbr
./app/assets/javascripts/discourse/app/components/topic-list-item.js
merefield@development:~/discourse$ find . -type f -name "topic-post-badges.*"
./app/assets/javascripts/discourse/app/templates/components/topic-post-badges.hbs
./app/assets/javascripts/discourse/app/templates/topic-post-badges.hbr
./app/assets/javascripts/discourse/app/components/topic-post-badges.js
يبدو إذن أن هناك عدة حالات يكون فيها هناك نسختان من مكون معين، إحداهما بصيغة .hbr والأخرى بصيغة .hbs؟
آه، على الأقل مع topic-list-item أرى أن التبديل يتم هنا:
محتويات ملف hbs:
{{topicListItemContents}}
جافا سكريبت الداعم:
@observes("topic.pinned")
renderTopicListItem() {
const template = findRawTemplate("list/topic-list-item");
if (template) {
this.set(
"topicListItemContents",
template(this, RUNTIME_OPTIONS).htmlSafe()
);
schedule("afterRender", () => {
if (this.selected && this.selected.includes(this.topic)) {
this.element.querySelector("input.bulk-select").checked = true;
}
});
}
},
ماكرة!
إذن هذا يوحي بأن ملفات hbr لا تحتوي على ملفات جافا سكريكت أساسية، ما لم تدعمها مثل هذه الحيلة؟
نعم، أعتقد أن هذا هو الحال. إذا كانت هناك طريقة أخرى، فلم أرَها حتى الآن!
هذا المراقب ليس مثاليًا، حيث نسعى للتخلص منه مع استمرارنا في ترقية Ember. أعتقد أن الطريقة الأفضل هي إنشاء دالة مساعدة (helper) ووضع كود JavaScript الخاص بك فيها. إليك مثالًا:
https://github.com/discourse/discourse-category-experts/blob/main/assets/javascripts/discourse/connectors/topic-list-after-title/category-experts-indicator.hbr
export function categoryExpertTopicListIndicators(context) {
let html = "";
html += addApprovedPills(context.topic, context.siteSettings);
html += addNeedsApprovalPill(
context.topic,
context.currentUser,
context.siteSettings
);
html += addIsQuestionPill(
context.topic,
context.currentUser,
context.siteSettings
);
return htmlSafe(html);
}
في بعض الأعمال الأخيرة، احتجت إلى أن تكون بعض “شجرة” القوالب قادرة على نقل البيانات من قالب ورقة باستخدام إجراءات الإغلاق، لذا قمت بتحويل بعض ملفات hbr إلى hbs لدعم ذلك.
هذا العمل تجريبي وأقدر أن له تأثيرًا على الأداء، لكن بعد تكرار التصميم عدة مرات لم أستطع إيجاد طريقة بديلة للقيام بذلك مع البقاء “داخل الإطار”.
ألا يمكنك تمرير دوال إلى دالة مساعدة واستدعاؤها هناك؟ لا أعتقد أنني جربت هذا، لكنني أتخيل أنه يمكنك فعل ذلك.
على وجه التحديد، أقوم بتحديد خصائص صورة في مكون ورقة، ثم تخزينها كخصائص للجد الأكبر للتأثير على التنسيقات التي يجب أن تستمر بعد عملية عرض القائمة الحالية. يجب بالتأكيد نقل البيانات إلى الأعلى. إذا كان بإمكان دالة مساعدة تحقيق ذلك، فذلك يبدو خيارًا جيدًا إذا واجهت صعوبة مع النهج الحالي، شكرًا لك!
