A Reactban a kellékek kifejezés tulajdonságokat jelent, és ezek a kellékek létfontosságú szerepet játszanak a React fejlesztési folyamatában. Az összetevők a React építőkövei. Ezek az összetevők kellékeket használnak a funkcionalitásuk javítására és a kód újrafelhasználására.
A React kellékek primitív értékeket, tömböket vagy függvényeket tárolnak. A kellékek számos funkcióval rendelkeznek, amelyek garantálják a teljesítményét, és ebből az oktatócikkből megtudhatja, hogyan kell pontosan használni a kellékeket a React alkalmazásaiban.
A React egyike a sok JavaScript-keretrendszernek, amelyet érdemes megtanulni .
A React kellékeknek nagyon fontos funkciója van; adatokat adnak át egyik komponensből a másikba. Csatornát biztosítanak, amelyen keresztül az összetevők kommunikálnak.
Van egy egyszerű szabály, amelyet meg kell tanulnia, mielőtt elkezdi használni a React kellékeket: minden összetevőnek ugyanúgy kell működnie, mint a tiszta funkciónak (a kellékek tekintetében). Ez egyszerűen azt jelenti, hogy a React komponens soha nem változtathatja meg egyik kellékének értékét. Ez biztosítja, hogy a kellékek csak kompromisszumok nélküli adatokat tartalmazzanak.
Ahhoz, hogy egy kelléket használjon a React programban, először át kell adnia a kelléket attribútumként a funkcionális komponensnek. Ezután hozzáférhet a kellékhez és annak adataihoz az összetevőn belül.
Például, ha feladatkövetőt hoz létre, akkor az egyik összetevő, amelyet szeretne, egy fejléc. Ez a fejléckomponens többek között az alkalmazás címét fogja tartalmazni. Ezért a fejléc komponens egy kelléket használhat az alkalmazás címének lekéréséhez.
function Header(props) { return (
{props.title}
);
}
export default Header;
A fenti Fejléc összetevő egy prop attribútumot vesz fel, és azt használja az alkalmazás címével kapcsolatos adatok eléréséhez. Ha ezt a fejléc- összetevőt meg szeretné jeleníteni a felhasználói felületen, először be kell illesztenie a React App.js fájljába (a Header összetevő címke használatával).
import Header from './components/Header'; function App() { return (
);
}
export default App;
A fenti kód a React App.js fájlját mutatja , amely megjeleníti a felhasználói felületet. Az App komponens a Fejléc összetevőt jeleníti meg a felhasználói felületen a
címke. Ha alaposan megnézi a kódot, látni fogja, hogy a
címke egy prop és egy prop értéket tartalmaz . Ezért a Fejléc összetevő mostantól hozzáfér egy címprofilhoz, amelyet a felhasználói felület saját részében használhat.
A React alkalmazás végrehajtása az App.js fájllal és a fenti új fejléc komponenssel a következő kimenetet generálja a böngészőben:
A fenti példában az egyszerű Header komponens nagyszerűen működik, ha megkapja a címreklámot . Azonban, ha eltávolítja a prop , ami áthaladt a Heade r komponens tag (mint az alábbi példában).
import Header from './components/Header'; function App() { return (
);
}
export default App;
Ezután a React alkalmazás a következő frissített felhasználói felületet kezdi megjeleníteni a böngészőben:
Amint látja, a felhasználói felület most teljesen üres. Szerencsére van egy egyszerű módszer a probléma enyhítésére. Ha egy alapértelmezett prop val-értéket ad a prop-t használó összetevőhöz, akkor hatékonyan eltávolítja ezt a problémát. Ez biztosítja, hogy még akkor is, ha az összetevő nem kap támasztékot , akkor is lesz prop értéke, amellyel dolgozni kell.
function Header(props) { return (
{props.title}
);
}
Header.defaultProps ={
title: 'The App Name'
}
export default Header;
A fenti kód a következő kimenetet hozza létre a böngészőben:
Mivel a Fejléc összetevő nem kap propot , az alapértelmezett prop értéket használja. Ha azonban újra beilleszti a propot az App.js fájlba, lecserélve ezt a kódsort :
Ezzel:
Ezután a felhasználói felületen a „Task Tracker” jelenik meg az alkalmazás címeként. Ezért a Header komponens csak akkor használja az alapértelmezett propot, ha nem kap külső propot .
A React megőrzi a kellékek integritását, mivel megakadályozza, hogy a kellékeket fogadó alkatrészek megváltoztassák értéküket. A kellékek integritásának megőrzésének egyik módja a propType tulajdonság használata. A PropType egy típus-ellenőrző tulajdonság, amely biztosítja, hogy az összetevőhöz átadott támaszok meghatározott típusúak legyenek.
Például egy React alkalmazás címe karakterlánc érték. Ezután a propType tulajdonság használata a fejléc összetevő prop típusának kifejezett megadására a legjobb módja annak, hogy a megadott prop karakterlánc-értékkel rendelkezzen.
import PropTypes from 'prop-types'; function Header(props) { return (
{props.title}
);
}
Header.defaultProps ={
title: 'The App Name'
}
Header.propTypes = {
title: PropTypes.string
}
export default Header;
A fenti Header komponens most a propType tulajdonságot használja . Egy lényeges különbség van a propType tulajdonság és a defaultProps tulajdonság használata között; a propType tulajdonság használatához importálnia kell az összetevőbe, míg a defaultProps tulajdonság a React összetevő hatókörébe tartozik.
A React egyik fő előnye, hogy lehetővé teszi a felhasználói felület létrehozását újrafelhasználható összetevők használatával. A React kompozit modulja lehetővé teszi ezt a funkciót. Egy általános összetevőre van szükség, és beállítja (a kellékekkel), hogy specifikusabb összetevőt hozzon létre.
Kapcsolódó: Mi az a ReactJS, és mire használható?
A feladatalkalmazás példájával létrehozhat egy feladatösszetevőt, és ezzel az összetevővel jelenítheti meg a felhasználó által létrehozott különböző feladatokat a felhasználói felületen. Először létre kell hoznia a feladat összetevőt.
import PropTypes from 'prop-types'; function Task(props) { return (
{props.name}
);
}
Task.defaultProps ={
name: 'Task Name'
}
Task.propTypes = {
name: PropTypes.string
}
export default Task;
A fenti Feladat összetevő egy általános fájl, amellyel több feladatot is létrehozhat az alkalmazásban. A következő lépés az, hogy helyezze el a Task összetevő címkéjét (a megfelelő kellékekkel együtt) abba az összetevőbe, amely megjeleníti azt a felhasználói felületen.
import Header from './components/Header'; import Task from './components/Task'; function App() { return (
);
}
export default App;
A frissített React alkalmazás a következő kimenetet produkálja a böngészőben:
Miután elolvasta ezt a cikket, meg kellett volna tanulnia, hogy ismernie kell a React kellékeket – az alapértelmezett kellékek létrehozásától az újrafelhasználható alkatrészekkel rendelkező kellékek használatáig.
De ez még csak a kezdet. Számos ingyenes React oktatóanyag megtanítja Önnek, hogyan hozhat létre komplett react alkalmazásokat, és mindegyik segít tudásának további bővítésében.
Az objektum-orientált programozás (OOP) a programozás egy formája, amelynek középpontjában az objektumok állnak: olyan kis egységek, amelyek egyesítik az adatokat és a kódot. A Simula volt az első OOP nyelv, amelyet fizikai modellek szimulálására hoztak létre. Az OOP használatával osztályokat definiálhat, amelyek sablonként működnek bizonyos típusú objektumok számára.
Virtuális környezet nélkül nem lehet sikeresen végrehajtani egy valós projektet Pythonban. Az olyan eszközök, mint a virtualenvwrapper és a virtualenv, általánosak a webfejlesztési virtuális környezetek létrehozására és kezelésére, míg az anacondát széles körben használják az adatkutatók.
A weboldal készítés nagyszerű módja annak, hogy kifejezze magát. Bár számos webhely-készítő eszköz létezik, saját maga megírása szórakoztató módja annak, hogy többet megtudjon a webhelyek színfalai mögötti működéséről. Egy jó kezdő projekt egy webhely létrehozása és háttérkép hozzáadása CSS-sel. Ez a projekt elindítja Önt a HTML és a CSS használatával.
A programoknak általában adatstruktúrára van szükségük a végrehajtás során szükséges adatok tárolására. Általában ezeket az adatokat változókban vagy tömbökben tárolják. Ezzel az a probléma, hogy elvész, amint a program befejezi a végrehajtást. Ez azért van, mert ezek ideiglenes memóriahelyek.
Ha Ön Python-fejlesztő, nagy hasznot húzhat a rendelkezésre álló keretrendszerek tömbjéből. Míg egyes keretrendszerek a legmegfelelőbbek nagy ökoszisztémák számára, mások konkrét fejlesztési célok kiszolgálására specializálódtak. Olvasson tovább, hogy megismerje az alapvető funkciókat, használatot és a két Python-keretrendszer – a Flask és a CherryPy – közötti különbségeket.
Gyakran szembesül a klasszikus dilemmával, miközben webhelyet készít magának vagy vállalkozásának. WordPress vs. Wix – melyiket válassza, és mi lenne a legjobb választás az Ön számára?
Ha azt tervezi, hogy frissíti a témát a WordPress-webhelyén, bővítményeket ad hozzá, vagy radikálisan megváltoztatja az irányt, érdemes időt szánni a tesztelésre, mielőtt a változtatások életbe lépnek.
A WordPress-t sok különböző cég használja tartalomkezelő rendszereihez. Ezért egyre nagyobb az igény a WordPress fejlesztőkre. Lehet, hogy már látott néhány álláshirdetést ezekre a pozíciókra.
A Python számos eszközt biztosít az adattudományhoz, a web- és az Android-fejlesztéshez. De a Python programozási nyelv egyik legjobb eszköze a Tkinter for Graphical User Interface. A python Tkinter könyvtára grafikus felületi widgeteket biztosít, amelyek segítenek felhasználóbarát alkalmazások létrehozásában. A Tkinter könnyen használható, könnyű és gyors. Nem kell kifejezetten telepítenie a Tkintert, mivel előre telepítve van a Pythonnal.
A Kotlin 2011-es Jetbrain általi beiktatása óta nagy hírnevet szerzett a fejlesztők közösségében. A statikusan tipizált és általános célú nyelvek közül Kotlin magasabb szinten áll a számítástechnika e korszakában tanulni kívánt programozási nyelvek többségéhez képest.
Ha számítógépek körül nőtt fel, és mindenhez ért az IT-hez, akkor lehet, hogy képes lesz programozó lenni. A modern munkaerőpiacon való versenyzés nagyon sok munkát igényel, így már a megfelelő készségek birtokában előnyt jelent.
A Raspberry Pi egy egylapos számítógép, amelyet azért hoztak létre, hogy mindenki számára elérhetővé tegye a számítástechnikát. Rengeteg kiegészítővel és globális közösségi támogatással gyengéd bevezetésként szolgál a fizikai számítástechnikába.
Egy blog indítása, még ha ingyenes is, nagy lépés – ezért ne tedd meg anélkül, hogy előbb felkészülnél. Ismerje meg az új bloggerek lépéseit és legnépszerűbb webhelyeit.
A Reactban a kellékek kifejezés tulajdonságokat jelent, és ezek a kellékek létfontosságú szerepet játszanak a React fejlesztési folyamatában. Az összetevők a React építőkövei. Ezek az összetevők kellékeket használnak a funkcionalitásuk javítására és a kód újrafelhasználására.
A gépi tanulás manapság mindenhol jelen van, a spamszűréstől és az arcfelismeréstől a hangasszisztensekig és a vezető nélküli autókig. A Microsoft Lobe nevű új alkalmazásának köszönhetően azonban nincs szükség mesterképzésre ahhoz, hogy megtanulja használni ezt az izgalmas technológiát.
Az objektum-orientált programozás (OOP) a programozás egy formája, amelynek középpontjában az objektumok állnak: olyan kis egységek, amelyek egyesítik az adatokat és a kódot. A Simula volt az első OOP nyelv, amelyet fizikai modellek szimulálására hoztak létre. Az OOP használatával osztályokat definiálhat, amelyek sablonként működnek bizonyos típusú objektumok számára.
Virtuális környezet nélkül nem lehet sikeresen végrehajtani egy valós projektet Pythonban. Az olyan eszközök, mint a virtualenvwrapper és a virtualenv, általánosak a webfejlesztési virtuális környezetek létrehozására és kezelésére, míg az anacondát széles körben használják az adatkutatók.
A weboldal készítés nagyszerű módja annak, hogy kifejezze magát. Bár számos webhely-készítő eszköz létezik, saját maga megírása szórakoztató módja annak, hogy többet megtudjon a webhelyek színfalai mögötti működéséről. Egy jó kezdő projekt egy webhely létrehozása és háttérkép hozzáadása CSS-sel. Ez a projekt elindítja Önt a HTML és a CSS használatával.
A programoknak általában adatstruktúrára van szükségük a végrehajtás során szükséges adatok tárolására. Általában ezeket az adatokat változókban vagy tömbökben tárolják. Ezzel az a probléma, hogy elvész, amint a program befejezi a végrehajtást. Ez azért van, mert ezek ideiglenes memóriahelyek.
Ha Ön Python-fejlesztő, nagy hasznot húzhat a rendelkezésre álló keretrendszerek tömbjéből. Míg egyes keretrendszerek a legmegfelelőbbek nagy ökoszisztémák számára, mások konkrét fejlesztési célok kiszolgálására specializálódtak. Olvasson tovább, hogy megismerje az alapvető funkciókat, használatot és a két Python-keretrendszer – a Flask és a CherryPy – közötti különbségeket.
Gyakran szembesül a klasszikus dilemmával, miközben webhelyet készít magának vagy vállalkozásának. WordPress vs. Wix – melyiket válassza, és mi lenne a legjobb választás az Ön számára?
Ha azt tervezi, hogy frissíti a témát a WordPress-webhelyén, bővítményeket ad hozzá, vagy radikálisan megváltoztatja az irányt, érdemes időt szánni a tesztelésre, mielőtt a változtatások életbe lépnek.
A WordPress-t sok különböző cég használja tartalomkezelő rendszereihez. Ezért egyre nagyobb az igény a WordPress fejlesztőkre. Lehet, hogy már látott néhány álláshirdetést ezekre a pozíciókra.
A Python számos eszközt biztosít az adattudományhoz, a web- és az Android-fejlesztéshez. De a Python programozási nyelv egyik legjobb eszköze a Tkinter for Graphical User Interface. A python Tkinter könyvtára grafikus felületi widgeteket biztosít, amelyek segítenek felhasználóbarát alkalmazások létrehozásában. A Tkinter könnyen használható, könnyű és gyors. Nem kell kifejezetten telepítenie a Tkintert, mivel előre telepítve van a Pythonnal.
A Kotlin 2011-es Jetbrain általi beiktatása óta nagy hírnevet szerzett a fejlesztők közösségében. A statikusan tipizált és általános célú nyelvek közül Kotlin magasabb szinten áll a számítástechnika e korszakában tanulni kívánt programozási nyelvek többségéhez képest.
