6
votos
Aceptado
Cuál es la diferencia entre React-Router y React-Router-Dom?
React Router se utiliza para proyectos que no hacen uso del DOM. Un ejemplo de esto son aplicaciones nativas que utilizamos en dispositivos móviles.
Por ejemplo, una aplicación creada con React ...
3
votos
./node_modules/react-router/index.js Module not found: Can't resolve 'history' in node_modules\react-router
Lo solucione con esta linea en la consola
npm install --save react-router@next history
3
votos
Aceptado
Type '{ path: string; component: () => Element; }' is not assignable to type Property 'component'
ya no se usa component , ahora es element, intenta de esta manera
<Route path="/" element={<Home />} />
y debes envolverlo en Routes
quedando de esta manera
<div className=&...
2
votos
Aceptado
React router, detectar cuando no tiene parametro
Podrías modificar un poco tu código, de entrada en tu componente de routeo podrías indicar a la ruta que el parámetro no es un parámetro obligatorio, que es un parámetro opcional, esto se hace a ...
2
votos
Aceptado
¿Cómo puedo redireccionar con react-router y el hook useEffect?
Para usar el Componente Redirect, necesitas incluirlo en el return de tu componente, usarlo dentro del useEffect no tendrá el resultado que esperas (no va a renderizar nada). Recuerda el principio del ...
2
votos
Aceptado
React JS como mostrar o no mostrar componentes
Se requiere controlar el componente <FooterComponent />, de tal forma que ReactJS lo devuelva o lo oculte:
este componente FooterComponent, NO quiero que se renderice cuando se renderiza el ...
2
votos
Aceptado
No me lleva a la página de error 404
Hola amigo a mi me paso lo mismo y lo solucione cambiando:
BrowserRouter por HashRouter
Cambia
<Route component={Error404} path="*"></Route>
por
<Route component={Error404}/&...
2
votos
Aceptado
¿Como abrir un enlace externo a React Router Dom?
Para hacer referencia a un sitio distinto al tuyo tienes que poner el link incluyendo el protocolo:
prueba:
<a href="https://www.facebook.com" target="_blank" rel="noopener ...
2
votos
sumar y restar campos dinámicos reactjs
Para lograr eso habría que agregarle un par de cosas a tu código.
Te propongo esta manera de hacerlo:
Primero creamos un nuevo estado llamado amount y lo inicializamos en 0.
const [amount, setAmount] ...
2
votos
Aceptado
Attempted import error: 'Switch' is not exported from 'react-router-dom'
en la version 6 cambio la sintaxis ahora es asi
import { render } from "react-dom";
import {
BrowserRouter,
Routes,
Route
} from "react-router-dom";
// import your route ...
2
votos
React router v6 dom no funciona sin componente desde render
Parece que la forma de obtener parámetros del URL también cambió en la versión 6 de react-router.
En la versión anterior, se podía usar la propiedad render del componente route, junto con el uso de ...
2
votos
Aceptado
React Router: Pasar propiedades de un componente por medio del componente Link
Nótese la diferencia entre react-router V5 y V6
Se puede configurar el componente Link con link to: object.
React Router V5
<Link to={{
pathname:`/description/${name}`,
state:"...
2
votos
Navegar por id de elemento en React v6
Si estas utilizando alguna biblioteca de estilos como bootstrap y no vez el resultado, esto puede ser por la propiedad class que en react es sustituida por className, aqui te dejo un link de la ...
2
votos
Aceptado
¿Como puedo incluir una barra de navegación en el contexto de router de React Router?
Puedes usar rutas anidadas, la ruta principal tendría dentro de su componente tanto la barra de navegación como el elemento <Outlet> que es una manera de indicar donde se deben renderizar las ...
2
votos
React Router: ¿Por qué mi proyecto de React generado al ejecutar npm run build se queda en blanco?
1- Estás intentado ejecutar tu proyecto de React abriéndolo desde el explorador de archivos, esto es imposible, la solución es ejecutarlo en un servidor local o real.
2- Tu proyecto está en un ...
1
voto
El carrusel no renderiza cuando me muevo en las paginas con react-router
Pude resolver el bug.
El problema estaba en el escuchador del inicializador:
"document.addEventListener('DOMContentLoaded', callback(){...}"
por alguna razón no se volvía a ejecutar el ...
1
voto
Aceptado
React - Volver atrás con las propiedades seleccionados en el formulario
Lo que intentas hacer no es posible, por defecto, porque básicamente cuando desmontas el componente. Se borra esa instancia de memoria y no es posible recuperarla, este es un gran problema en las SPA
...
1
voto
Aceptado
React JS - Pasar props de un navlink a un componente
acabo de probar el código y debería funcionar, si haces la configuración adecuada.
Generé el siguiente codesandbox: funcionando https://codesandbox.io/s/rough-tree-9iooj
Toma en cuenta que debes tener ...
1
voto
Aceptado
crear una división entre un campo input y un campo select - reactjs
Le faltarían algunos cambios a tu código.
Primero, dentro de la función useEffect1, no estás trayendo los datos del primer input correctamente. Los datos de ahí ya estaban justamente en el estado ...
1
voto
Una promesa dentro de useEffect regresa undefined
Cuando haces un fetch deberías esperarlo con await porque es una promesa. Un ejemplo sería utilizando una función async y dentro el await de fetch:
export const Photos = () => {
const [ photos,...
1
voto
Aceptado
El Login con Firebase auth no funciona en mi app React
Finalmente solucione el problema con la ayuda de otro usuario. El problema era que no estaba llamando bien a firebase/auth
De es
Tanto en App.js como en Signin.js cree una constante para señalar ...
1
voto
error select dinamico - reactjs
Añadi el codigo usando hooks
Te dejo el algorito funcionando en este link https://codesandbox.io/s/nifty-christian-wqxo2
import React, { useState } from "react";
let initialState = {
...
1
voto
Aceptado
Al escribir dentro de un input un valor numérico x quiero que me aparezca en un select el mismo numero del input pero -1 reactjs
Estabas casi! Sólo traslada las operaciones que estas realizando dentro de map, al método handleClick.
setValues([(+input - 1), ((+input - 1) * 2), ((+input - 1) * 2 * 2)])
Y luego imprime el option ...
1
voto
No he logrado que al escribir dentro de un input un numero luego este pase a un select y se reste -1 y luego se multiplique - reactjs
Tienes que utilizar un componente de React que tenga un state.
Te adjunto el ejemplo de como podría resolverse tu problema.
class MyComponent extends Component {
constructor(props) {
super(props)...
1
voto
Aceptado
que me muestre de forma dinámica los divisores dentro de un select que se agreguen en un input - reactjs
Lo que deberías hacer es controlar el valor ingresado en el input, y mediante ese valor, obtener el mod de tu número siempre y cuando el residuo sea cero, o lo equivalente, que la división sea exacta.
...
1
voto
Aceptado
Error de hooks al crear sistema de importación de rutas en APP.js de react
Me parece que el problema es por que el componente se carga aun cuando no esta en uso, algo para ayudar a generar tus rutas es el uso de lazy por lo que tu staticRoutes puede quedar de la siguiente ...
1
voto
Aceptado
Como pasar una propiedad del state a otra componente
Se puede envolver el botón con el componente Link, esto con la finalidad de llamar a las funciones del Componente uno al dar click en el vínculo ver más:
<Link to={`/Plantilla/${equipo.Equipo}`}>...
1
voto
Navegacion en la misma pagina con React
Si, usando el tag <a></a> con href al id o className de la sección se logra navegar en la misma página de una manera básica. Por ejemplo yo lo haría de este modo:
const Nav = () => {
...
1
voto
Navegacion en la misma pagina con React
para poder hacer una navegación entre secciones como tu dices primero debes tener en cuenta el concepto de componente, un componente podrías pensarlo como una etiqueta html que en algún futuro podrías ...
Only top scored, non community-wiki answers of a minimum length are eligible
Etiquetas relacionadas
react-router-dom × 172reactjs × 170
javascript × 48
react-hooks × 47
react-native × 8
vite × 7
html × 6
nodejs × 6
typescript × 6
react-redux × 6
router × 5
firebase × 4
react-navigation × 4
rutas × 3
webpack × 3
component × 3
firebase-auth × 3
css × 2
json × 2
bootstrap × 2
api × 2
express × 2
npm × 2
materialize × 2
redirección × 2