كيفية جعل جزء من النص في فقرة عريض/مائل/إلخ باستخدام دوال helper.h؟

ساهم تجربة المستخدم
1

ربما سؤال بسيط، لكنه أوقفني قليلاً :sweat_smile:

كيف يمكن تحقيق ذلك باستخدام دالة helper.h في Discourse؟

<div>
<p>هذا النص <i>مائل</i> </p>
</div>

أقرب ما وصلت إليه هو هذا:

    html() {
      return [  h('div'),
                h('p', "هذا النص" + h('i', "مائل"))
             ]
    }

والذي يعيد النتيجة التالية:
image

بخلاف ذلك، جربت عدة نسخ أخرى إما أن تعيد هذا النص أو مائل، لكن ليس الاثنان معًا :thinking:

على سبيل المثال، هذا:

    html() {
      return [  h('div'),
                h('p', "هذا النص", [h('i', "مائل")])
             ]
    }

يعيد فقط مائل
image

تقريبًا؟
هذا:

    html() {
      return [  h('div', ),
                h('p', [h('i', "مائل"), "هذا النص"])
             ]
    }

يعطيني هذا :sweat_smile:

image

2

معلمات الدالة h هي tagName، properties، و children. يمكنك تخطي properties إذا أردت، واستخدام tagName و children فقط. يمكن أن تكون children عقدة واحدة أو مصفوفة تحتوي على عدة عقد.

لذا أعتقد أنك تريد شيئًا مثل:

h('div',   // <div>
  h('p', [   // <p>
    'هذا النص ',
    h('i', 'مائل')  // <i></i>
  ])  // </p>
);  // </div>
6 إعجابات
3

شكرًا لك، لم أكن أدرك أن العقدة الواحدة يمكن أن تكون نصًا بسيطًا أيضًا. هذا أصبح قويًا جدًا الآن.

بمناسبة الحديث، هل فكرت يومًا في تقديم محوّل بسيط من HTML إلى دالة h؟ هذا من شأنه أن يسرّع التطوير كثيرًا في بعض الأحيان :slight_smile:

4

من الممكن استخدام قالب مثل هذا في بعض الحالات

https://github.com/discourse/discourse/blob/master/app/assets/javascripts/discourse/app/widgets/embedded-post.js#L11

5 إعجابات