تولتیپها یک راه کار مفید برای ارائه اطلاعات یا توضیحات اضافی برای عناصر در یک صفحه وب هستند. معمولاً زمانی که کاربران روی یک عنصر موسی را حرکت میدهند یا با آن تعامل میکنند، ظاهر میشوند و با ارائه زمینه و توضیح، شفافیت را فراهم میکنند. این بخش نحوه پیادهسازی تولتیپهای پایه را در برنامههای وب شما توضیح میدهد.
بخش "تولتیپ پایه" نشان داده است که چگونه از تولتیپها برای ارائه اطلاعات اضافی و راهنمایی به کاربران در هنگام تعامل با عناصر در صفحه وبتان استفاده کنید. با پیروی از این راهنماها و بهترین روشها، تجربه کاربری را بهبود بخشیده و زمینه ارزشمندی را بدون ایجاد اضافهوزن بر رابط کاربری فراهم کنید.
یک "تولتیپ هنگام کلیک" نوعی تغییری از تولتیپ سنتی است که زمانی که کاربر بر روی یک المان کلیک میکند، ظاهر میشود به جای اینکه روی آن هاور شود. این بخش توضیح میدهد که چگونه تولتیپها را که زمانی که رویدادهای کلیک اتفاق میافتد، پدیدار میشوند، در برنامه وب خود پیادهسازی کنید.
بخش "تولتیپ هنگام کلیک" نشان داده است که چگونه از تولتیپها استفاده کنید که زمانی که کاربران بر روی المانها در برنامه وب شما کلیک میکنند، ظاهر شوند. با دنبال کردن این راهنما و بهترین روشها، میتوانید اطلاعات اضافی و زمینه را به کاربرانتان ارائه دهید هنگامی که به آن نیاز دارند، و تجربه کلی کاربران را بهبود ببخشید.
یک "راهنمای روشن" نوعی از راهنمایی است که اطلاعات اضافی را زمانی که کاربر روی یک عنصر نگه میدارد، ارائه میدهد. این راهنماها با ظاهری ساده و حداقلی طراحی شدهاند. این بخش توضیح میدهد که چگونه راهنمای روشن را در برنامه وب خود پیادهسازی کنید.
بخش "راهنمای روشن" نشان داده است که چگونه از راهنماهایی که اطلاعات اضافی را زمانی که کاربر بر روی عناصر در برنامه وب شما نگه دارد، استفاده کنید. با پیروی از این راهنماها و روشهای بهتر، میتوانید درک کاربر را بهبود بخشیده و تجربه کلی کاربر را بهبود بخشید.
محتوای دلخواه راهنما به شما اجازه میدهد تا راهنماها را با اطلاعات شخصیسازی و پویا ایجاد کنید. به جای استفاده از متن استاتیک، میتوانید راهنماها را با محتوای پویا مانند تصاویر، آیکونها، یا حتی کامپوننتهای React پر کنید. این بخش توضیح میدهد که چگونه محتوای دلخواه راهنما را در برنامه وب خود پیادهسازی کنید.
بخش "محتوای تولتیپ سفارشی" نشان داده است که چگونه تولتیپها با محتوای شخصیسازی شده و پویا ایجاد شوند که به شما امکان میدهد به کاربران راهنمایی با غنا و ویژگیهای ویژهای ارائه دهید. با بهرهمندی از این ویژگی، میتوانید تجربه کاربری کلی و قابلیت استفاده از برنامه وب خود را بهبود بخشید.
تولتیپهای نمودار نقش اساسی در بصریسازی دادهها دارند، به کاربران اطلاعات ارزشمندی را در هنگام تعامل با نمودارها و نمودارها ارائه میدهند. این بخش توضیح میدهد که چگونه تولتیپهای نمودار را در برنامه وب خود یکپارچه کرده و به طور خاص به نیازهای آن تنظیم کنید.
بخش "تولتیپ نمودار" نشان داده است که چگونه تولتیپها برای نمودارها و بصریسازی دادهها ساخته و سفارشی شوند. با پیادهسازی تولتیپهای نمودار طراحی شده به خوبی، میتوانید به کاربران اطلاعات ارزشمندی را ارائه دهید، فهم آنها از دادهها را بهبود بخشیده و مشارکت کاربر را بهبود بخشید.
در این بخش، شما اطلاعات دقیقی درباره ویژگیها، کلاسها، و گزینههای موجود که میتوان با این مؤلفه استفاده کرد را پیدا خواهید کرد. درک این ویژگیها برای سفارشیسازی و پیکربندی مؤلفه برای تنظیمات خاص شما بسیار مهم است.
در زیر لیستی از ویژگیهایی که میتوان به اجزاء منتقل کرد، آمده است:
پراپ | نوع | شرح |
---|---|---|
`getRef` | `(el: PopperElement | null) => void` | یک تابع برای گرفتن مرجع به PopperElement یا null |
`content` | `string` | محتوایی که در راهنما نمایش داده میشود |
`as` | `string` | نوع عنصر HTML یا مولفه React برای نمایش |
`options` | `Props` | گزینههای اضافی برای سفارشیسازی راهنما ظاهر و رفتار |
پراپ | نوع | شرح |
---|---|---|
`to` | `string` | انتخاب کننده عنصر هدف برای راهنما (استفاده از ویژگی data-tooltip) |
`getRef` | `(el: HTMLElement | null) => HTMLElement` | تابعی برای دریافت مرجع به عنصر راهنما یا null |
`options` | `Props` | گزینههای اضافی برای سفارشیسازی راهنما ظاهر و رفتار |