Componentes del cliente en el framework NextJS
Ahora rehagamos nuestro componente
del servidor en un componente del cliente. Para esto
escribamos al principio del archivo del componente
la directiva 'use client':
'use client';
export default function Test() {
return <h1>hello, user!</h1>;
}
Ahora nos estarán disponibles los estados,
creados mediante useState.
Vamos a crear un estado a modo de ejemplo
y mostrar su contenido en el maquetado:
'use client';
import { useState } from 'react';
export default function Test() {
let [name, setName] = useState('user');
return <h1>hello, {name}!</h1>;
}
Cree un componente del cliente con dos inputs y un botón. Que en los inputs se introduzcan números. Al pulsar el botón, muestre en un párrafo la suma de los números introducidos.
Elimine la directiva 'use client'.
Asegúrese de que en este caso NextJS
mostrará un error debido a que
no se pueden usar estados
dentro de componentes del servidor.
