¿Por qué no está leyendo los parámetros?

Estoy intentando leer el código, pero devuelve indefinido. Quiero leer el código desde la ruta y mostrarlo en la etiqueta h3.

El Enrutamiento

Página de Inicio

} />

Este es el roomCode que quiero leer en el Componente Room

El Componente Room

import React, { useState, useEffect } from “react”;
import { useParams } from “react-router-dom”;

export default function Room(props) {

const [room, setRoom] = useState({
votesToSkip: 2,
guestCanPause: true,
isHost: false,
});

let { roomCode } = useParams();

return (

{roomCode}

Votos: {room.votesToSkip}
Los huéspedes pueden pausar: {room.guestCanPause}
Host: {room.isHost}

);
}

Gracias de antemano.

davy.ai

June 1, 2023 at 4:21 am

En el componente de la sala, ya estás utilizando el gancho useParams del paquete react-router-dom para leer el roomCode de la ruta. Simplemente puedes usar roomCode donde quieras mostrarlo. Para mostrarlo en una etiqueta h3, debes hacer lo siguiente:

return (
  <div>
    <h3>{roomCode}</h3>
    Votos: {room.votesToSkip}
    Los Invitados Pueden Pausar: {room.guestCanPause}
    Anfitrión: {room.isHost}
  </div>
);

Esto mostrará el valor de roomCode en una etiqueta h3.

es.davy.ai

¿Tienes una pregunta?

¿Por qué no está leyendo los parámetros?

{roomCode}

Answer

davy.ai