آموزش نحوه ایجاد React Datepicker از ابتدا با مثال

سرفصل ها و درس ها

با Dates In React کار کنید Work with Dates In React

• بررسی اجمالی Overview

• معرفی Introduction

• استراتژی اجرای اصلی تقویم Basic Calendar Implementation Strategy

• مقدمه ای بر کتابخانه لحظه Introduction to the Moment Library

• ترکیب روزها در هفته Combining Days into Weeks

• تقویم JSX Calendar JSX

• نتیجه Conclusion

یک مؤلفه تقویم قابل استفاده مجدد بسازید Build a Reusable Calendar Component

• بررسی اجمالی Overview

• معرفی Introduction

• کنترل های اصلی تقویم Basic Calendar Controls

• یک تقویم "کنترل شده" ایجاد کنید Create a "Controlled" Calendar

• مولفه های "کتابخانه ای-آگنوستیک". "Library-Agnostic" Components

• تقویم با پارامترهای پرس و جو Calendars with Query Parameters

• اضافه کردن یک ظاهر طراحی شده با اجزای سبک Add Styling with Styled Components

• نتیجه Conclusion

یک ردیاب رویداد در React بسازید Build an Event Tracker in React

• بررسی اجمالی Overview

• معرفی Introduction

• استراتژی پیاده سازی ردیاب رویداد پایه Basic Event-Tracker Implementation Strategy

• "وانیل" React Modals "Vanilla" React Modals

• یک فرم رویداد جدید بسازید Build a New Event Form

• اضافه کردن محتوا به سلول های تقویم Add Content to Calendar Cells

• اجتناب از آلودگی مورد استفاده Avoiding Use-Case Pollution

• داده های رویداد اضافی Additional Event Data

• نتیجه Conclusion

در React یک Date-Picker Single-Date بسازید Build a Single-Date Date-Picker in React

• بررسی اجمالی Overview

• معرفی Introduction

• انواع مختلف تاریخ انتخاب Different Types of Date Pickers

• گذراندن اجزاء به عنوان لوازم جانبی Passing Components as Props

• انتخاب تاریخ های مجرد Selecting Single Dates

• ایجاد کامپوننت پنجره کشویی Creating a Dropdown Window Component

• نتیجه Conclusion

در React یک Date-Range Date-Picker بسازید Build a Date-Range Date-Picker in React

• بررسی اجمالی Overview

• معرفی Introduction

• مبانی انتخابگر محدوده تاریخ Date-Range Picker Basics

• محاسبه در بین تاریخ Calculating In-Between Dates

• روش دیگری برای محاسبه بین تاریخ ها Another Method of Calculating In-Between Dates

• یک ظاهر طراحی "قرص" برای سلول های تقویم "Pill" Styling for Calendar Cells

• نتیجه Conclusion

در React یک انتخاب کننده تاریخ چندتایی بسازید Build a Multi-Date Date-Picker in React

• بررسی اجمالی Overview

• معرفی Introduction

• مبانی انتخاب تاریخ چندتایی Multi-Date Date-Picker Basics

• منطق و استایل چند تاریخ Multi-Date Logic and Styling

• محاسبه تاریخ های قبلی و بعدی Calculating Previous and Next Dates

• اضافه کردن روزهای خارج از ماه Adding Out-Of-Month Days

• نتیجه Conclusion

بهبود انتخابگر تاریخ Date Picker Enhancements

• بررسی اجمالی Overview

• معرفی Introduction

• بهبودهای پایه انتخابگر تاریخ Basic Date-Picker Enhancements

• Refactoring Single-Date-Picker Single-Date-Picker Refactoring

• بازسازي بازه تاريخي انتخابگر Date-Range-Picker Refactoring

• چند تاریخ انتخاب مجدد Multi-Date-Picker Refactoring

• نتیجه Conclusion