React: "data-Reactroot =" "` فقد في تصيير الخادم إذا كان العنصر داخل `<context.provider>"</context.provider>

هل تريد طلب ميزة أو الإبلاغ عن خطأ ؟

حشرة.

ما هو السلوك الحالي؟

استدعاء .renderToString() على <React.Fragment><div>Hello!</div></React.Fragment> ينتج <div data-reactroot="">Hello!</div> .

ومع ذلك ، يتم تقديم العديد من التركيبات الأخرى لعنصر جذر DOM ضمن عناصر React "غير المرئية" بدون data-reactroot="" .

على سبيل المثال ، كل ما يلي ينتج <div>Hello!</div> (بدون data-reactroot="" ):

<React.Fragment><React.Fragment><div>Hello!</div></React.Fragment></React.Fragment>

<Context.Provider><div>Hello!</div></Context.Provider>

<Context.Consumer>{() => <div>Hello!</div>}</Context.Consumer>

<React.StrictMode><div>Hello!</div></React.StrictMode>

إذا كان السلوك الحالي عبارة عن خطأ ، فالرجاء تقديم خطوات إعادة الإنتاج ، وإن أمكن عرضًا بسيطًا للمشكلة. الصق الرابط إلى JSFiddle (https://jsfiddle.net/Luktwrdm/) أو مثال CodeSandbox (https://codesandbox.io/s/new) أدناه:

أنظر فوق.

ما هو السلوك المتوقع؟

أفترض أن أيًا من الأمثلة المذكورة أعلاه يجب أن ينتج عنه ترميز يتضمن data-reactroot="" على العنصر div .

ما إصدارات React وأي متصفح / نظام تشغيل متأثر بهذه المشكلة؟

الإصدار موجود في جميع الإصدارات> = 16.7.0 ، وربما الإصدارات السابقة أيضًا.

هذه مشكلة صغيرة - أعتقد أنها ستؤثر فقط على المكان الذي يتم فيه ترطيب الترميز من جانب العميل باستخدام .render() بدلاً من .hydrate() - وهو الاستخدام الذي لا يُنصح به. ومع ذلك ، لا يزال استخدام .render() لإعادة الترطيب مدعومًا رسميًا.

يمكنني تنفيذ الإصلاح وإجراء العلاقات العامة. لكن هل يمكن لأي شخص أن يؤكد أن السلوك المتوقع هو ما أعتقده ، وأن هذا بالفعل خطأ؟