کپی کردن متن در react js با جاوااسکریپت
حافظهی کلیپ بورد همیشه در پروژههای تحت وب و… یکی از نکات دسترس پذیری بهتر است. در این نوشته به روش ساخت یک دکمه برای ذخیره کردن متن در کلیپ بورد به کمک جاوااسکریپت در ری اکت میپرداریم.
کپی کردن متن در react js با جاوااسکریپت
برای اینکار از کد زیر استفاده کنید:
<button
onClick={() => navigator.clipboard.writeText('Copy this text to clipboard')}
>
Copy
</button>
اگر آموزشهای بیشتری در ارتباط با جاوااسکریپت میخواهید در بخش نظرات این نوشته برای ما بنویسید.
برای امتیاز به این نوشته کلیک کنید!
[کل: 1 میانگین: 5]


















اگه دکمه داخل فرم باشه، روی submit تاثیری داره؟
اگر دکمه کپی داخل فرم باشد، روی عملکرد submit تاثیری نخواهد داشت و فقط متن مورد نظر را کپی میکند.
امکان نمایش پیغام موفقیت بعد از کپی کردن هست؟
بله، امکان نمایش پیغام موفقیت وجود دارد. میتوانید با استفاده از state در کامپوننت React، وضعیت کپی شدن را مدیریت کرده و پیغام مورد نظر را نمایش دهید.
میشه بجای متن ثابت، متن از state گرفته بشه؟
بله حتماً، میتوانید متن مورد نظر را از state دریافت کرده و سپس آن را به متد writeText پاس دهید.
اگه متن طولانی باشه، navigator.clipboard هنوز جواب میده؟
سلام مهدی عزیز، بله، navigator.clipboard.writeText برای کپی کردن متنهای طولانی هم کاملاً کارآمد است.
این روش روی همه مرورگرها کار میکنه؟
بله، این روش با استفاده از navigator.clipboard در اکثر مرورگرهای مدرن پشتیبانی میشود.