நீங்கள் ரியாக்ட் ஹூக்குகளைப் பற்றி இதுவரை கற்றுக்கொள்ளாத ரியாக்ட் டெவலப்பர் என்றால், இப்போதுதான் தருணம். இந்த இடுகையானது யூஸ் எஃபெக்ட் ரியாக்ட் ஹூக்கை விரிவாகப் பார்க்கும். இது சுவிஸ் ராணுவ கத்திக்கு சமமான கொக்கி. ஒரு கூறு ஏற்றப்படும்போது தரவை எவ்வாறு பெறுவது, நிலை அல்லது ப்ராப் மாறும்போது குறியீட்டை எவ்வாறு இயக்குவது, டைமர்கள் அல்லது இடைவெளிகளை எவ்வாறு அமைப்பது மற்றும் பல போன்ற பல்வேறு சிக்கல்களைத் தீர்க்கிறது.
JSX (எந்த வகையான பக்க விளைவுகளும்) திரும்பப் பெறாத ரியாக்ட் பாகத்தில் நீங்கள் "செய்ய" விரும்பும் எதற்கும் ஒரு யூஸ் எஃபெக்ட் பயன்படுத்தப்படுகிறது. நீங்கள் ஒரு கூறுக்கு பல பயன்பாட்டு விளைவுகள் இருக்கலாம்.
இந்த சக்தி அனைத்தும் ஒரு செலவில் வருகிறது: இது எவ்வாறு செயல்படுகிறது என்பதை நீங்கள் புரிந்து கொள்ளாவிட்டால், அது குழப்பமாக இருக்கலாம். இந்த இடுகையில், நாங்கள் பல்வேறு எடுத்துக்காட்டுகளைப் பார்ப்போம், இதன் மூலம் நீங்கள் கருத்தியல் மாதிரியைப் புரிந்துகொண்டு அதை உங்கள் சொந்த குறியீட்டில் பயன்படுத்தலாம்.
எதிர்வினை கொக்கிகள் - அது என்ன தீர்க்க முயற்சிக்கிறது?
ஹூக்ஸ் முதலில் ரியாக்ட் பதிப்பு 16.8 இல் அறிமுகப்படுத்தப்பட்டது மற்றும் இப்போது பல ரியாக்ட் திட்டங்களால் பயன்படுத்தப்படுகிறது. ஹூக்ஸ் கூறுகளுக்கு இடையில் மீண்டும் மீண்டும் வரும் குறியீட்டின் சிக்கலைச் சமாளிக்கிறது. அவை வகுப்புகளைப் பயன்படுத்தாமல் எழுதப்பட்டுள்ளன. ரியாக்ட் வகுப்புகளை கைவிடுவதை இது குறிக்கவில்லை; கொக்கிகள் வெறுமனே ஒரு மாற்று முறையாகும்.
ரியாக்ட், ஸ்டேட்ஃபுல் தர்க்கத்துடன் கூடிய அதிநவீன கூறுகளை விரைவாக உருவாக்க உங்களை அனுமதிக்கிறது. வினைத்திறன் வாழ்க்கைச் சுழற்சி முறைகளை வர்க்கம் நம்பியிருப்பதால் இந்தக் கூறுகளைப் பிரிப்பது கடினம். இங்குதான் ரியாக்ட் ஹூக்ஸ் வருகிறது.
ஒரு கூறுகளை சிறிய செயல்பாடுகளாகப் பிரிக்க அவை உங்களை அனுமதிக்கின்றன. லைஃப்சைக்கிள் முறைகளின் அடிப்படையில் குறியீட்டை சிறிய துண்டுகளாகப் பிரிப்பதற்குப் பதிலாக, நீங்கள் இப்போது செயல்பாட்டின் அடிப்படையில் குறியீட்டை சிறிய அலகுகளாக ஏற்பாடு செய்து பிரிக்கலாம்.
யூஸ் எஃபெக்ட் ஹூக் என்றால் என்ன?
ஹூக்ஸ் என்பது ES6 வகுப்புகளை எழுதாமல் நிலை மற்றும் பிற எதிர்வினை திறன்களை அணுக உங்களை அனுமதிக்கும் செயல்பாடுகளாகும். ரியாக்ட் ஹூக்ஸ் ஏபிஐ யூஸ் எஃபெக்ட் எனப்படும் ஹூக்கைக் கொண்டுள்ளது. எதிர்வினை வாழ்க்கைச் சுழற்சிகள் உங்களுக்குத் தெரிந்திருந்தால், யூஸ் எஃபெக்ட் ஹூக் கூறுDidMount, கூறுDidUpdate, மற்றும் பாகம்அன்மவுண்ட் ஒருங்கிணைந்த வாழ்க்கை சுழற்சி முறைகள்.
ரியாக்ட் ஹூக்ஸ் ஆவணங்களின்படி, இது ES6 வகுப்பு கூறு வாழ்க்கை சுழற்சி முறைகளுடன் சில சிக்கல்களைத் தீர்க்க உருவாக்கப்பட்டது.
தொடரியல்
முதல் வாதம் ஒரு கால்பேக் செயல்பாடாகும், இது ஒவ்வொரு ரெண்டருக்கும் பிறகு இயல்பாகவே செயல்படுத்தப்படும். இரண்டாவது அளவுரு என்பது ஒரு விருப்ப சார்பு வரிசையாகும், இது இலக்கு நிலை மாறினால் மட்டுமே திரும்ப அழைக்க ஹூக்கை அறிவுறுத்துகிறது.
ஹூக் ஒவ்வொரு சார்புநிலையின் வரலாற்று மற்றும் தற்போதைய நிலைகளை ஒப்பிடுகிறது. இரண்டு மதிப்புகளும் பொருந்தவில்லை என்றால், ஹூக் முதல் அளவுருவில் குறிப்பிடப்பட்ட அழைப்பை அழைக்கிறது. சார்பு வரிசைகள் வழக்கமான கால்பேக் நடத்தையை மாற்றி, கூறு நோக்கத்தில் உள்ள மற்ற அனைத்து கூறுகளையும் ஹூக் புறக்கணிக்கிறது என்பதற்கு உத்தரவாதம் அளிக்கிறது.
அடிப்படை பயன்பாடு
ஒரு செய்தியைச் சேமிக்க, மேலே உள்ள குறியீடு மாதிரியில் ரியாக்ட் யூஸ்ஸ்டேட்டைப் பயன்படுத்துகிறேன். அதன் பிறகு, எனது செய்தி நிலை மாறியை எடுத்து திரையில் அச்சிடுகிறேன். இருப்பினும், கூறு ஏற்றப்பட்ட ஒரு வினாடிக்குப் பிறகு செய்தியை மாற்றியமைக்க நான் இப்போது Effect ஐப் பயன்படுத்த விரும்புகிறேன்.
ரியாக்ட் ஃப்ரேம்வொர்க்கிலிருந்து யூஸ் எஃபெக்டை இறக்குமதி செய்த பிறகு யூஸ்ஸ்டேட் வரியின் பின்னால் எனது விளைவைச் செருகினேன். Effect ஐப் பயன்படுத்துவதற்கான முதல் அளவுரு ஒரு செயல்பாடு ஆகும். இந்த செயல்பாடு ஹேண்ட்லர் செயல்படுத்தப்படும் போது, நீங்கள் வழங்கும் எந்த பக்க விளைவுகளையும் அது கவனித்துக்கொள்ளும். செயல்பாடு என்பது ஒரு கால்பேக் செயல்பாடு ஆகும், இது எதிர்வினை கூறு வாழ்க்கை சுழற்சி நிகழ்வுகளில் ஒன்று நிகழும்போது அழைக்கப்படுகிறது.
அதை எப்போது பயன்படுத்த வேண்டும்?
யூஸ்எஃபெக்ட் ஹூக் பல்வேறு சூழ்நிலைகளில் பயனுள்ளதாக இருக்கும். பின்வருபவை மிகவும் முக்கியமானவை:
- வழங்கப்பட்ட வாதத்தைப் பொறுத்து தரவைப் பெற விரும்பினால், கிளையன்ட் பக்கத்திலிருந்து இந்த அளவுருவை மாற்றலாம். புதிய தரவுகளுடன் அளவுரு புதுப்பிக்கப்பட்ட பிறகு அது திரும்ப அழைக்கப்படும்.
- ஒரு API இறுதிப் புள்ளியிலிருந்து தரவை மீட்டெடுத்து கிளையன்ட் பக்கத்தில் காட்ட விரும்பினால். எங்கள் கூறுகளை வழங்கும்போது, யூஸ்எஃபெக்ட் ஹூக்கிற்கு கொடுக்கப்பட்ட செயல்பாடு அல்லது ஹேண்ட்லர் செயல்படுத்தப்படும், மேலும் கூறு நிலைகளில் உள்ள தரவு மீட்டெடுக்கப்படும். இந்த நிலைகள் பின்னர் பயனர் இடைமுகக் கூறுகளில் பயன்படுத்தப்படுகின்றன.
- உங்கள் கூறு வெளி உலகத்திலிருந்து தரவை நம்பியிருக்கும் போது மற்றும் தரவு வரும் என்பதை எங்களால் உறுதி செய்ய முடியவில்லை என்றால், நாங்கள் எஃபெக்டைப் பயன்படுத்த வேண்டும் (ஒருவேளை சர்வர் செயலிழந்திருக்கலாம்). சிக்கல்களைத் தூக்கி எறிந்து மற்ற கூறுகள் காட்டப்படுவதைத் தடுப்பதற்குப் பதிலாக, அவற்றை யூஸ் எஃபெக்ட் ஹூக்கில் வைக்கவும்.
பயன்பாடு வழக்குகள்
முதல் ஓட்டத்திற்குப் பிறகு கூறு மீண்டும் வழங்கினால், அது இயங்காது.
எப்பொழுதெல்லாம் ஒரு கூறு ரெண்டர் அல்லது ரீ-ரெண்டர் செய்தால், அது எப்போதும் செயல்படுத்தப்பட வேண்டும்.
இயல்பாக, நிரல் ஒரு முறை மட்டுமே இயங்கும். பின்னர், ப்ராப் மதிப்புகள் மாறினால், இயக்கவும்:
ஒத்திசைவற்ற செயல்பாடுகளுக்கு, எப்போதும் useEffect ஐப் பயன்படுத்தவும்.
useEffect குறியீடு தொகுதிகள் உங்கள் சக டெவலப்பர்களுக்கான ஒத்திசைவற்ற வேலைகளின் தெளிவான குறிப்பான்கள். யூஸ் எஃபெக்ட்டைப் பயன்படுத்தாமல் ஒத்திசைவற்ற குறியீட்டை உருவாக்குவது சாத்தியம், ஆனால் இது “ரியாக்ட் முறை” அல்ல, மேலும் இது சிக்கலான தன்மையையும் தவறுகளின் அபாயத்தையும் அதிகரிக்கிறது.
UI ஐ நிறுத்தக்கூடிய ஒத்திசைவற்ற குறியீட்டை எழுதுவதற்குப் பதிலாக useEffect ஐப் பயன்படுத்துவது ரியாக்ட் சமூகத்தில் நன்கு அறியப்பட்ட நுட்பமாகும், குறிப்பாக ரியாக்ட் குழு ஒரு பக்க விளைவைச் செய்ய அதை உருவாக்கிய விதம்.
இதைப் பயன்படுத்துவதன் மற்றொரு நன்மை என்னவென்றால், டெவலப்பர்கள் குறியீட்டை மதிப்பாய்வு செய்து, "கட்டுப்பாட்டு ஓட்டத்திற்கு வெளியே" இயங்கும் குறியீட்டை உடனடியாகக் கண்டறிய முடியும், இது முதல் ரெண்டர் சுழற்சிக்குப் பிறகுதான் முக்கியமானது. மேலும், தொகுதிகள் மீண்டும் பயன்படுத்தக்கூடிய மற்றும் இன்னும் சொற்பொருள் தனிப்பயன் கொக்கிகளில் பிரித்தெடுக்க ஏற்றது.
ஒரு உதாரணம்
UseEffect குறியீட்டைப் பயன்படுத்தி, ஒரு வினாடிக்கு ஒரு எண்ணை அதிகரிக்கவும்.
தீர்மானம்
யூஸ்எஃபெக்ட் ஹூக்கின் அடிப்படை வடிவமைப்புக் கொள்கைகள் மற்றும் சிறந்த நடைமுறைகளைப் புரிந்துகொள்வது, எனது பார்வையில், நீங்கள் அடுத்த நிலை ரியாக்ட் டெவலப்பராக மாற விரும்பினால் கற்றுக்கொள்வது ஒரு முக்கியமான திறமையாகும்.
சுருக்கமாக, யூஸ்எஃபெக்ட் ஹூக் ஒரு செயல்பாட்டைப் பெறுகிறது, இது கட்டாய, சாத்தியமான முழு தர்க்கத்தையும் உள்ளடக்கியது. இரண்டாவது அளவுருவான சார்பு வரிசை, செயல்படுத்தலைப் பாதிக்கப் பயன்படும். அதைக் கையாளும் போது, திரும்பும் செயல்பாட்டைப் பயன்படுத்தி துப்புரவுக் குறியீட்டை எழுதுவதும் அவசியம்.
கட்டுரை பயனுள்ளதாக இருந்தால் கருத்துகளில் எங்களுக்குத் தெரியப்படுத்துங்கள்.
ஒரு பதில் விடவும்