[英]Inserting Next.js Links into an html string
I have an html string that I retrieve from an API.我有一个从 API 检索到的 html 字符串。
const htmlString = "<p>Hello World</p>";
I'm using react's dangerouslySetInnerHTML
to display that content on my page.我正在使用 react 的dangerouslySetInnerHTML
在我的页面上显示该内容。
Now before displaying it, I'd like to process it and put a link on " World ".现在在显示它之前,我想对其进行处理并在“世界”上放置一个链接。 But not an <a>
Tag.但不是<a>
标签。 I need an actual Next.js <Link>
tag.我需要一个实际的 Next.js <Link>
标签。 So a string replace probably won't do the job.所以字符串替换可能无法完成这项工作。
The result I want to achieve in jsx is:我想在 jsx 中实现的结果是:
const processed = <p>Hello <Link href="/my-route"><a>World</a></Link></p>
I've thought of using React.createElement but I'm not sure how to interpolate the content inside the string.我曾想过使用 React.createElement 但我不确定如何在字符串中插入内容。
Any ideas how I could achieve this?有什么想法我能做到这一点吗?
Hello<Link href="https://github.com">World</Link>
You dont need to specify another anchor tag inside a link.您不需要在链接中指定另一个锚标记。 This should work fine.这应该可以正常工作。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.