I want to redirect to a totally different url with my Link component (from react-router-dom), but instead, it just adds those characters to my current url. For example, if I click this Link being on "http://localhost:3000/pin-detail/5HHceZ3LuAltt4AEKn2LYc"
<Link to={`user-profile/${pinDetail.postedBy?._id}`} className='flex gap-2 m5-5 items-center bg-white dark:bg-darkg rounded-lg mt-2'>
<img src={pinDetail.postedBy?.image} alt="user-profile" className='w-8 h-8 rounded-full object-cover' />
<p className='font-semibold capitalize dark:text-white'>{pinDetail.postedBy?.userName}</p>
</Link>
It goes to "http://localhost:3000/pin-detail/5HHceZ3LuAltt4AEKn2LYc/user-profile/104293279805278412025". I want that the link redirects me to "localhost:3000/user-profile/${pinDetail.postedBy?._id". How can I do that?
CodePudding user response:
You need to add a / before as saied on comment by Matt, like this
<Link to={`/user-profile/${pinDetail.postedBy?._id}`} className='flex gap-2 m5-5 items-center bg-white dark:bg-darkg rounded-lg mt-2'>
<img src={pinDetail.postedBy?.image} alt="user-profile" className='w-8 h-8 rounded-full object-cover' />
<p className='font-semibold capitalize dark:text-white'>{pinDetail.postedBy?.userName}</p>
</Link>