Uus funktsioon React 19 -s, mis võimaldab edastada rekvisiidid rekvisiitidena, selle asemel, et kasutada "ForwardRef", võib arengutõhusust parandada mõnel peamisel viisil:
Lihtsam ja intuitiivsem API
REFS -i läbimine regulaarsete rekvisiitidena on loomulikum ja intuitiivsem API, võrreldes "Forwerref" kasutamisega. See vastab paremini põhilise reageerimise põhimõttele, et anda andmete edastamine komponendipuu kaudu rekvisiitide kaudu. See muudab koodi lihtsamaks mõistetavaks ja arutlemiseks, eriti algajate jaoks.
Vähendatud katlaplaat
"ForwardRef" kasutamine nõuab lapsekomponendi pakkimist "CorwnRef" kõnele ja edastada "ref" teise argumendina funktsiooni komponendile. See lisab mõnda katlakoodi. REF -i edastamine otse rekvisiitina välistab selle lisakoodi.
Parem kapseldamine
"ForwardRef" kasutamisel peab lapse komponent olema teadlik, et ta saab ref ja peab selle vastava DOM -elemendi külge kinnitama. REF -i edastamine progina võimaldab lapse komponendil jääda refist teadlikuks, parandades kapseldamist.
Lihtsam refraktorid
Kui teil on vaja komponendipuu uuesti teha ja ref -manuse punkti muuta, on lihtsam värskendada tugi nime, selle asemel, et värskendada kõnet "ForwerRef" kõnet mitmes kohas. See muudab koodibaasi hooldatavamaks.
Kooskõlas klassikomponentidega
Klassi komponentides kinnitatakse ref -id, kasutades ref -i, mitte spetsiaalse "Forwerref" mehhanismi kaudu. Kui lubada rekvisiitidena funktsiooni komponentide rekvisiitidena, annab klassi- ja funktsiooni komponentide järjekindlam API.
Lihtsama tüüp kontrollimine
TypeScripti kasutamisel on lihtsam kirjutada rekvisiitidena edastatud ref -i, võrreldes "Forwerref" ja "refatributes" kasutamisega. Rekvisiidi tüübi saab järeldada otse objekti ref -st.
Kokkuvõtlikult võib öelda, et uued ref -i funktsioonid muudavad React API intuitiivsemaks, vähendab katlaplaati, parandab kapseldamist ja muudab koodibaasi hooldatavamaks - see kõik parandab arendaja tõhusust, kui töötate React 19 -s ja väljaspool seda [1] [3] [4].
Tsitaadid:[1] https://www.copycat.dev/blog/react-forwardref/
]
[3] https://legacy.reactjs.org/docs/forwarding-refs.html
]
]
[6] https://react.dev/blog/2024/04/25/react-19-Upgrade-guide
]
[8] https://www.freecodecamp.org/news/new-react-19-features/