تایپاسکریپت - مودال دیالوگ React با Material UI روی کانتینر سفارشی


من در حال تلاش برای نمایش دیالوگی هستم که فقط تا حدی مدال باشد، به گونهای که روی یک عنصر خاص مدال باشد، تا کاربر بتواند همچنان با سایر بخشهای برنامه تعامل داشته باشد. مستندات مشخص میکنند که یک کامپوننت دیالوگ دارای ویژگی container و fullscreen است. من تلاش کردهام ویژگی container را به عنصر div که میخواهم دیالوگ و پسزمینه روی آن رندر شود، تنظیم کنم. اما هیچ نتیجهای نداشته است.

اینجا مستندات کامپوننت دیالوگ قرار دارد https://material-ui-next.com/api/dialog/

هر کمکی بسیار قدردانی خواهد شد!

پاسخ شماره ۱

من با همان مشکل روبرو شدم. این موضوع در بخش <Dialog /> مستند نشده است، اما اگر به مستندات API برای کامپوننت <Modal /> نگاه کنید، یک prop به نام 'container' وجود دارد و از آنجا که Dialog در واقع فقط یک کامپوننت Modal تغییر یافته است، میتوانید از همان props استفاده کنید...

<Dialog
    container={() => document.getElementById('parentCo')}>
</Dialog>