پورتال ها (Portals) ویژگی جدیدی در ریکت اند که به ما کمک میکنند المنتی را در جای مشخصی از DOM قرار بدیم.
همانطور که میدونید تموم کامپوننت ها و المنت هایی که در ریکت میسازیم، درون المنتی با آیدی "root " قرار میگیرند، حال با معرفی پورتال ها، ما به راحتی میتونیم Modals, Tooltips, Popovers, Loader و کلا المنت هایی که استایل به خصوصی دارند رو به خونه جدیدی منتقل کنیم!
نحوه استفاده از اونا خیلی راحته، کافیه در قسمت return کامپوننت بنویسیم:
نکته 1: element همان المنتی هست که میخواهیم در خارج از سلسه مراتبش قرار بگیرد.
نکته 2: domNode آدرس قسمت مد نظرمون از DOM که برای اشاره کردن به آن، میتونیم از getElementById، querySelector و... استفاده کنیم.
برای واضح تر شدن مطلب، بیاید یه مثال بنویسیم:
در قدم اول، در صفحه index.HTML، المنت جدیدی را با آیدی مد نظر میسازیم:
و در قدم دوم، المنت مد نظر را درون تابعی که بهش اشاره کردم، قرار میدهیم:
به همین راحتی، میتوان یک المنتی را به جای دیگری از DOM منتقل کرد!
