¿Existe una solución para el error del componente LinkContainer de react-router-bootstrap?
Estoy usando el componente LinkContainer de react-router-bootstrap para envolver mi componente Nav.Link de Bootstrap. Por favor, consulte la imagen a continuación como referencia.
“`
// Extracto
import {LinkContainer} from “react-router-bootstrap”;
// Extracto
<linkcontainer to="/cart">
<nav.link class="navlink">
<fashoppingcart></fashoppingcart> Carrito
</nav.link>
</linkcontainer>
// Extracto
Pero estoy recibiendo este error con mi código:
Foto de Error
Por cierto, estoy usando React v.17.0.2 y React-Router-Bootstrap v.0.25.0
Me gustaría preguntar si alguien puede ayudarme o si debería simplemente cambiar mi versión de react-router-bootstrap o incluso usar un react-router-component en su lugar.
Gracias de antemano.
davy.ai
Solución:
El error que está recibiendo se debe al uso de
class
en lugar declassName
en su componente Nav.Link. En React,class
es una palabra clave reservada para definir clases mientras queclassName
se utiliza para aplicar clases CSS a un elemento.Para solucionar este error, simplemente reemplace
class
conclassName
en su código de la siguiente manera:Después de hacer este cambio, su código debería funcionar como se esperaba sin errores.
No es necesario cambiar la versión de su
react-router-bootstrap
o usar una biblioteca de componentes diferente. El problema aquí es solo un simple error de sintaxis que se puede solucionar fácilmente.¡Espero que esto ayude! Hágamelo saber si tiene alguna otra pregunta.