Component

React applications are built from independent pieces of UI called components.

Esta página todavía no se ha traducido — se muestra en su idioma original:Català

Introduction

A React component is a TypeScript function to which you can add TSX.

Create a project with Deno

deno init --npm vite --template react-swc-ts react-component

Component

Define the Greeting component which is used by the App component:

tsx

export default function App() {
  return <Greeting/>
}

function Greeting() {
  return <p className="fs-3 p-4 border">Hello X</p>
}

Els components de React són funcions regulars de TypeScript, però els seus noms han de començar amb lletra majúscula o no funcionaran!

El component Greeting està nidat dins del component App.

Pots afegir tants components Greeting com vulguis dins del component App:

tsx

export default function App() {
  return (
    <>
      <Greeting />
      <Greeting />
      <Greeting />
    </>
  )
}

function Greeting() {
  return <p className="fs-3 m-2 p-2 border text-center">Hello X</p>
}

Al final el que el navegador veu és això:

html

<p class="fs-3 m-2 p-2 border text-center">Hello X</p>
<p class="fs-3 m-2 p-2 border text-center">Hello X</p>
<p class="fs-3 m-2 p-2 border text-center">Hello X</p>

Estás leyendo una vista previa.

Inicia sesión para leer el artículo completo. Cualquier cuenta abre 4 artículos gratuitos al mes; el alumnado y el profesorado leen las páginas de su curso sin límite.

Iniciar sesión

Component

#Introduction

#Component

Introduction

Component