CodeariaAcademy

ื˜ืงืกื˜ื—ื“ืฉ

ืงื• ืชื—ืชื•ืŸ ื ื›ื ืก ื•ื™ื•ืฆื

ื‘ืžืขื‘ืจ ืขื›ื‘ืจ ืงื• ื ื›ื ืก ืžืชื—ืช ืœืงื™ืฉื•ืจ ืžืฆื“ ืื—ื“, ื•ื›ืฉื”ืกืžืŸ ืขื•ื–ื‘ ื”ื•ื ื™ื•ืฆื ืžื”ืฆื“ ื”ืฉื ื™. ืืคืงื˜ ื ืงื™ ืœื ื™ื•ื•ื˜.

ื”ืชืืžื”

underlineFrom
underlineTo

ืžื‘ื•ืกืก ืขืœ Underline Comes In Goes Out (MIT ืจื™ืฉื™ื•ืŸ) ยท ืชื ืื™ ืฉื™ืžื•ืฉ

ืขื•ื“ ื‘-Pro

ืœื›ืœ ื”ืจื›ื™ื‘ื™ื
ืงืจืŸ ืžื•ื ืคืฉืชProืฉื“ื” ASCIIProื›ืคืชื•ืจ ืžื’ื ื˜Proื“ื•ืง ื›ืžื• ื‘-macOSPro

ืžืืคื™ื™ื ื™ื

9 ืžืืคื™ื™ื ื™ื
ืžืืคื™ื™ืŸืกื•ื’ื‘ืจื™ืจืช ืžื—ื“ืœืชื™ืื•ืจ
childrenReactNodeโ€”ื˜ืงืกื˜ ื”ืงื™ืฉื•ืจ.
direction'left' | 'right'"left"ืžืื™ื–ื” ืฆื“ ื”ืงื• ื ื›ื ืก.
underlineHeightRationumber0.1ืขื•ื‘ื™ ื”ืงื• ื‘ื™ื—ืก ืœื’ื•ื“ืœ ื”ื’ื•ืคืŸ.
underlinePaddingRationumber0.01ืจื•ื•ื— ื‘ื™ืŸ ื”ืงื• ืœื˜ืงืกื˜ ื‘ื™ื—ืก ืœื’ื•ื“ืœ ื”ื’ื•ืคืŸ.
transitionValueAnimationTransition"{ duration: 0.4, ease: 'easeInOut' }"ืžืฉืš ื•ืชื–ืžื•ืŸ ืชื ื•ืขืช ื”ืงื•.
asElementType"span"ืชื’ื™ืช ื”-HTML ืฉืœ ื”ืืœืžื ื˜.
classNamestringโ€”ืžื—ืœืงื•ืช ื ื•ืกืคื•ืช.
underlineFromstring"#ffffff"ื”ืฆื‘ืข ื‘ืชื—ื™ืœืช ื”ืงื• ื”ืชื—ืชื•ืŸ. ื”ื•ื ืขื•ื‘ืจ ื‘ื”ื“ืจื’ื” ืœืฆื‘ืข ื”ืฉื ื™.
underlineTostring"#a1a1aa"ื”ืฆื‘ืข ื‘ืกื•ืฃ ื”ืงื• ื”ืชื—ืชื•ืŸ.

ืชืœื•ื™ื•ืช

2 ื—ื‘ื™ืœื•ืช ื ื“ืจืฉื•ืช

npm install clsx motion

ืจื›ื™ื‘ื™ื ื“ื•ืžื™ื

ืœื›ืœ ื”ืจื›ื™ื‘ื™ื
ื˜ืงืกื˜ ืžืชืขืจื‘ืœืื•ืชื™ื•ืช ืงื•ื‘ื™ื™ื”Proื˜ืงืกื˜ ื ืžืกPro