Type to search…

State

Els components sovint necessiten canviar el que apareix a la pantalla com a resultat d'una interacció.

This page hasn't been translated yet — shown in its original language:Català

Introducció

Crea un nou projecte amb el nom react-state:

shell
deno init --npm vite --template react-swc-ts react-state

Esdeveniment

React et permet afegir controladors d’esdeveniments al teu TSX.

A continuació tens un botó que quan hi fas clic no fa res:

tsx
export default function App() {

  return <button className="btn btn-primary m-5">No hago nada</button>
}

Un controlador d’esdeveniment és una funció que s’executarà quan l’usuari faci alguna cosa:

tsx
export default function App() {

  // Controlador de evento
  function handleClick() {
    alert("Bienvendio al Norte!")
  }

  return <button className="btn btn-primary m-5">No hago nada</button>
}

Pots confirmar que el botó no fa res i la funció mai s’executa 🥳

El botó té la propietat “nullable” onClick?, el valor de la qual és una funció que s’executarà quan l’usuari faci clic al botó:

tsx
export default function App() {

  // Controlador de evento
  function handleClick() {
    alert("Bienvendio al Norte!")
  }

  return <button className="btn btn-primary m-5" onClick={handleClick}>No hago nada</button>
}

You're reading a preview.

Sign in with Google to read the full page. A Google account includes 5 free pages in total; students and teachers read their course pages without limit.

Sign in