I have a data.jsx page with multiple data arrays which I then map out on my component jsx file. one of the array entries is a link in an a tag but when I try to visit the link on my localdev it presents me with an error; problem is clearer below
here is part of my code for my data.jsx file:
id: 1, /* RESILIENT FITNESS */
img: Work1,
modalImg: WorkModal1,
title: 'Website Build',
details: [
{
icon: <FiFileText />,
title: 'Project : ',
desc: 'Website',
},
{
icon: <FiUser />,
title: 'Client : ',
desc: 'Resilient Fitness',
},
{
icon: <FaCode />,
title: 'Language : ',
desc: 'HTML, CSS, JavaScript',
},
{
icon: <FiExternalLink />,
title: 'Preview : ',
desc: <a href="www.example.com">Click Here</a>,
},
the last part has a desc with a preview so viewers can visit the website by ‘clicking here’; however Im not sure if the issue is the code itself or its because Im working on my local dev (localhost:5173); this is the error when I actually try to click on ‘Click Here’ in the desc
I’m not sure if this is only happening as Im on a localhost; will the issue resolve itself once I deploy the website?
2
Answers
As you can see you want to redirect on some page but the error shows the link is postfixed to localhost url. and hence it’s giving you error.
Currently I’ve a solution is to call a function on click and in that function assign the url.
Hope It’ll help. Thanks
Replace
www.example.com
withhttp(s)://www.example.com
.