logo

Komponenty funkcjonalne ReactJS

Komponent funkcjonalny to jeden ze sposobów tworzenia komponentów w aplikacji React. Komponenty funkcjonalne React.js pomagają tworzyć komponenty interfejsu użytkownika w funkcjonalny i bardziej zwięzły sposób. W tym artykule dowiemy się o komponentach funkcjonalnych w React, różnych sposobach wywoływania komponentów funkcjonalnych, a także dowiemy się, jak tworzyć komponenty funkcjonalne. Zademonstrujemy także zastosowanie haków w elementach funkcjonalnych

Spis treści



Komponenty funkcjonalne w React:

ReactJS Komponenty funkcjonalne to niektóre z bardziej powszechnych komponentów, które można spotkać podczas pracy w React. Są to po prostu funkcje JavaScript. Komponent funkcjonalny możemy stworzyć w React, pisząc funkcję JavaScript. Funkcje te mogą, ale nie muszą, odbierać dane jako parametry. W komponentach funkcjonalnych wartością zwracaną jest kod JSX do renderowania w drzewie DOM.

Sposoby wywoływania komponentu funkcjonalnego:

Funkcje w JavaScript możemy wywoływać na inne sposoby w następujący sposób:

1. Wywołaj funkcję, podając nazwę funkcji i nawiasy.

// Example of Calling the function with function name followed by Parentheses function Parentheses() {  return (; }; const PropsExample = () =>{ // const [zmiana, setChange] = useState(true);  const [zmiana, setChange] = useState(false);  return ( setChange(!change)}> Kliknij tutaj! {change? ( 'Witamy w techcodeview.com' /> ): ( 'Portal informatyczny dla maniaków' /> )} ); }; eksportuj domyślny przykład rekwizytów;Krok, aby uruchomić aplikację: Otwórz terminal i wpisz następujące polecenie.  npm start Dane wyjściowe: Otwórz przeglądarkę, a nasz projekt zostanie wyświetlony pod adresem URL http://localhost:3000/>