Functionele component is een manier om componenten in een React-applicatie te maken. React.js Functionele Componenten helpt om UI-componenten op een functionele en beknoptere manier te creëren. In dit artikel leren we over functionele componenten in React, verschillende manieren om de functionele component aan te roepen, en leren we ook hoe we de functionele componenten kunnen maken. Ook zullen we het gebruik van haken in functionele componenten demonstreren
Inhoudsopgave
- Functionele componenten in React:
- Manieren om de functionele component aan te roepen:
- Probleem met het gebruik van functionele componenten
- Voordeel van het gebruik van haken in functionele componenten
Functionele componenten in React:
ReactJS Functionele componenten zijn enkele van de meest voorkomende componenten die u tegenkomt tijdens het werken in React. Dit zijn eenvoudigweg JavaScript-functies. We kunnen een functionele component in React creëren door een JavaScript-functie te schrijven. Deze functies kunnen wel of niet gegevens als parameters ontvangen. In de functionele componenten is de retourwaarde de JSX-code die moet worden weergegeven in de DOM-structuur.
Manieren om de functionele component aan te roepen:
We kunnen de functies in JavaScript op andere manieren als volgt aanroepen:
1. Roep de functie aan door de naam van de functie te gebruiken, gevolgd door de haakjes.
// Example of Calling the function with function name followed by Parentheses function Parentheses() { return (; }; const PropsExample = () =>{// const [wijzigen, setChange] = useState(true); const [wijzigen, setChange] = useState(false); return ( setChange(!change)}> Klik hier! {change ? ( 'Welkom bij techcodeview.com' /> ) : ('Een computerwetenschappelijk portaal voor nerds' /> )} ); }; standaard PropsExample exporteren;Stap om de applicatie uit te voeren: Open de terminal en typ de volgende opdracht. npm start Uitvoer: Open de browser en ons project wordt weergegeven in de URL http://localhost:3000/>