React: الفكرة: دعم اختزال قيمة الخاصية الحرفية للكائن في صيغة jsx

تم إنشاؤها على ١٦ نوفمبر ٢٠١٤  ·  3تعليقات  ·  مصدر: facebook/react

ستكون الفكرة أن تكون قادرًا على القيام بما يلي:

{this.state.list.map((item, key) => <MyComponent {item, key} />)}

ما رأيك في ذلك؟

ال 3 كومينتر

أنا أميل إلى قول لا. لقد تحدثنا كثيرًا عن الاستفادة من تراكيب مختلفة ونحاول أن نجعلها أقل ما يمكن. كانت إضافة {...spread} صفقة كبيرة بالفعل.

ccsebmarkbage

نحاول الحفاظ على مناقشات بناء الجملة في: https://github.com/facebook/jsx وبهذه الطريقة يمكننا أن يكون لدينا مجموعة أكبر تساهم في بناء الجملة لجعل الأمر يستحق الوزن الزائد للغة.

أعتقد أن الفرق بين <Foo {item} /> و <Foo {...item} /> و <Foo item /> قد يكون محيرًا للغاية. الأخيرين مدعومين بالفعل.

أنا أحب الطريقة التي تفكر بها بالرغم من ذلك. إذا كنت تشعر بشدة حيال هذا ، يجب عليك فتح مشكلة على https://github.com/facebook/jsx

https://github.com/facebook/jsx/pull/118

^ اقتراح لبناء جملة تعبير الكائن كما تمت مناقشته هنا.

أعتقد أن الفرق بين و و قد يكون محيرا للغاية.

قد يكون الارتباك نسبيًا. لا يعد <Foo item /> مفيدًا جدًا نظرًا لأنه يتم تقييمه دائمًا إلى {item: true}. بعد فوات الأوان ، يبدو الأمر محدودًا للغاية ، لكن يمكنني أن أفهم سلوكه من خلال جينات html. أنا شخصيا لم أجد فائدة كبيرة لذلك.

و ليست مربكة إذا نظرت إليها من منظور تدوين الكائن ES8. {item} اختصار لـ {item: item} . {...item} هو اختصار للنسخ السطحي / المنتشر في كائن جديد.

بمجرد أن يفهم شخص ما أن jsx transpiles إلى h(name: string | Component, props: {[name]: any}, ...children) . ObjectExpression يقع بشكل طبيعي.

من المربك أن <Foo {x} /> غير مدعوم ولكن <Foo {...x} /> مدعوم. الحل هو
<Foo {...{x}} /> وهو أمر محير أكثر.

هل كانت هذه الصفحة مفيدة؟
0 / 5 - 0 التقييمات