Агар шумо як таҳиягари React бошед, ки то ҳол дар бораи қалмоқҳои React нафаҳмидааст, айни замон аст. Ин паём ба таври муфассал аз useEffect React Hook мегузарад. Ин муодили қалмоқе ба корди артиши Швейтсария аст. Он масъалаҳои гуногунро ҳал мекунад, ба монанди чӣ гуна ба даст овардани маълумот ҳангоми васл кардани ҷузъ, чӣ гуна иҷро кардани код ҳангоми тағир додани ҳолат ё реквизит, чӣ гуна танзим кардани таймерҳо ё фосилаҳо ва ғайра.
UseEffect барои қариб ҳама чизе, ки шумо мехоҳед дар ҷузъи React "кор кунед" истифода мешавад, ки JSX-ро барнамегардонад (ҳар намуди таъсири тараф). Шумо инчунин метавонед якчанд эффектҳои useEffects барои як ҷузъ дошта бошед.
Ҳамаи ин қудрат як арзиш дорад: агар шумо нафаҳмед, ки он чӣ гуна кор мекунад, он метавонад ҳайратовар бошад. Дар ин паём, мо мисолҳои гуногунро дида мебароем, то шумо модели консептуалиро дарк кунед ва онро ба рамзи худ татбиқ кунед.
Hooks React — Чиро хал карданй аст?
Ҳукҳо бори аввал дар версияи React 16.8 ҷорӣ карда шуданд ва ҳоло аз ҷониби бисёр лоиҳаҳои React истифода мешаванд. Hooks мушкилоти такрори кодро байни ҷузъҳо бартараф мекунад. Онҳо бе истифодаи синфҳо навишта шудаанд. Ин маънои онро надорад, ки React дарсҳоро тарк мекунад; қалмоқҳо танҳо як усули алтернативӣ мебошанд.
React ба шумо имкон медиҳад, ки зуд ҷузъҳои мураккабро бо мантиқи давлатӣ эҷод кунед. Ҷудо кардани ин ҷузъҳо душвор аст, зеро синф ба усулҳои React Lifecycle такя мекунад. Дар ин ҷо React Hooks ворид мешавад.
Онҳо ба шумо имкон медиҳанд, ки ҷузъро ба функсияҳои хурдтар тақсим кунед. Ба ҷои тақсим кардани код ба қисмҳои хурдтар дар асоси усулҳои Lifecycle, шумо ҳоло метавонед кодро вобаста ба функсияҳо ба воҳидҳои хурдтар ҷудо кунед.
UseEffect Hook чист?
Қалмоқҳо функсияҳое мебошанд, ки ба шумо имкон медиҳанд, ки бидуни навиштани синфҳои ES6 ба вазъият ва дигар қобилиятҳои реаксия дастрасӣ пайдо кунед. React hooks API дорои қалмоқе бо номи useEffect мебошад. Агар шумо бо давраҳои ҳаёти реаксия шинос бошед, қалмоқе, ки useEffect аст, ҳамон аст komponentDidMount, komponentDidUpdateва komponentWillUnmount усулҳои давраи ҳаёт якҷоя.
Тибқи ҳуҷҷатҳои React Hooks, он барои ҳалли баъзе масъалаҳо бо усулҳои давраи ҳаёти ҷузъи синфи ES6 сохта шудааст.
Матн
Аргументи аввал ин функсияи бозгашт аст, ки пас аз ҳар як намоиш ба таври нобаёнӣ иҷро мешавад. Параметри дуюм массиви ихтиёрии вобастагӣ мебошад, ки ба Ҳук дастур медиҳад, ки танҳо дар сурати тағир ёфтани ҳолати ҳадаф бозпас занг занад.
Ҳук ҳолати таърихӣ ва ҳозираи ҳар як вобастагиро муқоиса мекунад. Агар ду арзиш мувофиқат накунанд, қалмоқ занги бозгаштеро, ки дар параметри аввал нишон дода шудааст, даъват мекунад. Массивҳои вобастагӣ рафтори маъмулии бозгаштро тағир медиҳанд ва кафолат медиҳанд, ки Ҳук ҳама ҷузъҳои дигарро дар доираи компонент сарфи назар мекунад.
Истифодаи асосӣ
Барои захира кардани паём, ман React useState-ро дар намунаи коди дар боло зикршуда истифода мебарам. Пас аз он, ман тағирёбандаи ҳолати паёми худро мегирам ва онро дар экран чоп мекунам. Бо вуҷуди ин, ман ҳоло мехоҳам, ки Effect-ро истифода барам, то як сония пас аз насби компонент тағир дода шавад.
Ман эффекти худро пас аз ворид кардани useEffect аз чаҳорчӯбаи React дар паси хати useState ҷойгир кардам. Аввалин параметр барои useEffect ин функсия аст. Вақте ки ин коркардкунандаи функсия иҷро мешавад, он ҳама гуна таъсири манфиеро, ки шумо пешниҳод мекунед, ғамхорӣ мекунад. Функсия функсияи бозхонд мебошад, ки ҳангоми рух додани яке аз рӯйдодҳои давраи ҳаёти ҷузъи React даъват карда мешавад.
Кай бояд истифода кард?
Ҳоки useEffect метавонад дар ҳолатҳои гуногун муфид бошад. Инҳо аз ҳама муҳиманд:
- Мо метавонем ин параметрро аз ҷониби муштарӣ тағир диҳем, вақте ки мо мехоҳем вобаста ба далели додашуда маълумот гирем. Он пас аз таҷдиди параметр бо маълумоти нав ба ёд оварда мешавад.
- Агар мо хоҳем, ки маълумотро аз нуқтаи ниҳоии API дарёфт кунем ва онро дар тарафи муштарӣ намоиш диҳем. Вақте ки ҷузъи мо намоиш медиҳад, функсия ё коркардкунанда ба қалмоқе, ки ба useEffect дода шудааст, иҷро мешавад ва маълумот дар ҳолати компонентҳо гирифта мешавад. Ин ҳолатҳо баъдан дар ҷузъҳои интерфейси корбар истифода мешаванд.
- Вақте ки ҷузъи шумо ба маълумот аз ҷаҳони беруна такя мекунад ва мо наметавонем боварӣ ҳосил кунем, ки маълумот ворид мешавад, мо бояд Effect-ро истифода барем (шояд сервер дар он ҷо бошад). Ба ҷои гузоштани мушкилот ва пешгирӣ кардани намоиши ҷузъҳои дигар, онҳоро дар қалмоқчаи useEffect ҷойгир кунед.
Истифодаи парвандаҳо
Агар компонент пас аз иҷрои аввал дубора намоиш дода шавад, он иҷро намешавад.
Ҳар вақте, ки ҷузъро намоиш медиҳад ё аз нав намоиш медиҳад, он бояд ҳамеша иҷро карда шавад.
Бо нобаёнӣ, барнома танҳо як маротиба кор мекунад. Пас аз он, агар арзишҳои prop тағир ёбад, иҷро кунед:
Барои фаъолиятҳои асинхронӣ ҳамеша useEffect-ро истифода баред.
Блокҳои рамзи useEffect аломатҳои равшани корҳои асинхронӣ барои таҳиягарони ҳамтоёни шумо мебошанд. Бе истифодаи useEffect коди асинхронӣ эҷод кардан мумкин аст, аммо ин "Усули React" нест ва он ҳам мураккабӣ ва ҳам хатари хатогиҳоро зиёд мекунад.
Истифодаи useEffect ба ҷои навиштани рамзи асинхронӣ, ки метавонад UI-ро боздорад, як техникаи маъруф дар ҷомеаи React мебошад, махсусан он шеваи дастаи React онро барои иҷрои таъсири тараф сохтааст.
Бартарии дигари истифодаи он дар он аст, ки таҳиягарон метавонанд кодро аз назар гузаронанд ва кодеро, ки "берун аз ҷараёни назорат" иҷро мешавад, фавран ошкор кунанд, ки танҳо пас аз давраи аввалини намоиш муҳим мешавад. Ғайр аз он, блокҳо барои истихроҷ ба Ҳукҳои фармоишии такрорӣ ва ҳатто семантикии бештар мувофиқанд.
Мисоле
Бо истифода аз рамзи useEffect, рақамро дар як сония афзоиш диҳед.
хулоса
Фаҳмидани принсипҳои асосии тарроҳӣ ва таҷрибаҳои беҳтарини useEffect Hook, ба назари ман, як маҳорати муҳим барои омӯхтани он аст, ки агар шумо хоҳед, ки таҳиягари сатҳи ояндаи React шавед.
Барои ҷамъбаст, useEffect Hook функсияеро мегирад, ки дорои мантиқи императивӣ ва эҳтимолан таъсирбахш аст. Массиви вобастагӣ, ки параметри дуюм аст, метавонад барои таъсир расонидан ба иҷро истифода шавад. Ҳангоми кор бо он, инчунин бо истифода аз функсияи бозгашт навиштани рамзи тозакунӣ зарур аст.
Дар шарҳҳо ба мо хабар диҳед, ки оё мақола муфид буд.
Дин ва мазҳаб