Necesito pasar un objeto a través de Link en react-router v6. ¿Cómo puedo hacerlo? Adjunto un fragmento de mi código. El usuario debe venir a otro componente.
import React from 'react' import { Link } from 'react-router-dom' export default function UserCard(props) { const { name, company, city, user } = props return ( <div className='user-card__container' > <div className='user-card__main-info'> <div className='user-card__fullname'> <span className='main-info__point'>ФИО:</span> {name}</div> <div className='user-card__city'> <span className='main-info__point'>город: </span>{city}</div> <div className='user-card__company'> <span className='main-info__point'> компания: </span>{company}</div> </div> <Link to={`user/${user.id}`} className='user-card__button-profile'> <div > Подробнее </div> </Link> </div> )}No estoy seguro si con react-router v6 es posible pasar un objeto como consulta Params. Puede usar el paquete de cadena de consulta para analizar queryParams en el objeto, lo que le permitirá manipularlos fácilmente y luego clasificarlos antes de pasarlos al enlace.
import qs from 'query-string'; ... const queryParam = qs.parse(location.search); const newQueryParam = { ...queryParam, user_role: 'admin', something_else: 'something', } ... <Link to={{ pathname: '/admin/users', search: qs.stringify(newQueryParam)}} />algo como esto:
<Link to={{ pathname: `user/${user.id}`, search: `objname=${JSON.stringify({ ...yourObj})}` } } >o
<Link to={{ pathname: `user/${user.id}`, query: { param1: param1, param2: param2, paramobj: JSON.stringify(yourObj) } } >