React-dnd: رد فعل إعداد DnD لمثال متداخل قابل للفرز؟

تم إنشاؤها على ١٢ نوفمبر ٢٠١٥  ·  7تعليقات  ·  مصدر: react-dnd/react-dnd

أنا أعمل على مكون قائمة متداخلة باستخدام رد فعل dnd وقد استخدمت مثال بسيط قابل للفرز. يمكنني الحصول على عمل السحب / الإفلات لعقد المستوى الأول ، ولكن بعد ذلك ينتج جميع الأطفال "خطأ من النوع: العقدة غير محددة" عند محاولة السحب. لدي أساسًا مكون قائمة ومكون عنصر ، ويستدعي مكون العنصر نفسه إذا كان لديه عناصر فرعية.

هل لديك مثال على القوائم المتداخلة القابلة للفرز؟

التعليق الأكثر فائدة

@ 3Cbwaltz حسنًا ، ألق نظرة على هذا: https://github.com/tamagokun/example-react-dnd-nested

ستكون أكثر اهتمامًا بـ app/components/Tree app/components/Item و app/containers/Index لمعرفة كيفية إعداد كل شيء. أتخيل أنه يمكن إجراء الكثير من التحسينات ، لكنني آمل أن تساعد.

ال 7 كومينتر

إذا كان لديك خطأ فيرجى تقديم مثال يعيد إنتاج هذا الخطأ.
أتمنى أن أتمكن من تخمين ما يحدث من رسالة خطأ ولكن للأسف لا أستطيع. :غمزة:

ها أنت ذا:
http://stackoverflow.com/questions/33659180/react-dnd-not-sure-how-to-get-drag-and-drop-to-fire-for-nested-components-of-t

إذا كنت بحاجة إلى أي شيء آخر أعلمني.

لدي إعداد عملي قابل للفرز متداخل في تطبيق أعمل عليه.

سأعمل على تنظيفه وإلقائه على جيثب.

@ 3Cbwaltz

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

tamagokun هل قلت أن لديك مثال متداخل قابل للفرز؟ لقد تمكنت من تجسيد مكوناتي أكثر من ذلك بقليل ولكن لم يكن لدي الوقت الكافي لف رأسي حول متداخلة قابلة للفرز. هنا رابط لكود المصدر الكامل https://bitbucket.org/bwaltz6/flow-builder/overview. عذرًا ، هناك الكثير من التعليمات البرمجية وربما لن تتمكن من تجميعها لأنها تستخدم مستودع npm خاص بالشركة. إذا لزم الأمر يمكنني شحذها. الملفات ذات الأهمية هنا:

غلاف
https://bitbucket.org/bwaltz6/flow-builder/src/8c22774c1b59aa381b563f6cf60fb1a5f2b9d39a/dist/FlowBuilder.js؟at=master&fileviewer=file-view-default

قائمة
https://bitbucket.org/bwaltz6/flow-builder/src/8c22774c1b59aa381b563f6cf60fb1a5f2b9d39a/dist/menu.js؟at=master&fileviewer=file-view-default

NodeItem
https://bitbucket.org/bwaltz6/flow-builder/src/8c22774c1b59aa381b563f6cf60fb1a5f2b9d39a/dist/nodeItem.js؟at=master&fileviewer=file-view-default

أعتقد أن ما علي فعله الآن هو إضافة علامة <ul> بالداخل بواسطة nodeItem <li> وجعل هذا هدف الإسقاط. حيث يتم قطع الاتصال ، فإن nodeItems هي بالفعل أهداف إسقاط ومصادر سحب وكل ما أريد فعله هو أن أكون قادرًا على تكرار ذلك داخل ul ... داخل nodeItem. لست متأكدًا من كيفية القيام بذلك الجزء. هل أحتاج إلى نوع من الميراث؟

اسمحوا لي أن أقوم بشيء ما ...

@ 3Cbwaltz حسنًا ، ألق نظرة على هذا: https://github.com/tamagokun/example-react-dnd-nested

ستكون أكثر اهتمامًا بـ app/components/Tree app/components/Item و app/containers/Index لمعرفة كيفية إعداد كل شيء. أتخيل أنه يمكن إجراء الكثير من التحسينات ، لكنني آمل أن تساعد.

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