简体   繁体   English

如何使用 Next.js 中的反应图标添加指向另一个网站的链接

[英]How can I add a link to another website using react-icons in Next.js

How can I add links to my react-icons.如何将链接添加到我的反应图标。 I want to link the LinkedIn button to my linked in and have a mailto option for the mail icon.我想将 LinkedIn 按钮链接到我的链接,并为邮件图标提供一个 mailto 选项。

I am using Next.js and TailwindCSS to create my application.我正在使用 Next.js 和 TailwindCSS 来创建我的应用程序。

Here is the snippet of my code.这是我的代码片段。

<div className="text-5xl flex justify-center gap-16 py-3 text-gray-600 dark:text-gray-50">
    <AiFillLinkedin href="https://www.google.com/"/>
    <AiFillMail href="mailto:info@mailgo.dev"/>
           
 </div>

Have you attempted to wrap this in a tag?您是否尝试过将其包装a标签中?

<div className="text-5xl flex justify-center gap-16 py-3 text-gray-600 dark:text-gray-50">
    <a href="https://www.google.com/"><AiFillLinkedin /></a>
    <a href="mailto:info@mailgo.dev"><AiFillMail /></a>
 </div>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 在 Next.js 应用程序上的 Chart.js 图中对 pointStyles 使用 react-icons - Use react-icons for pointStyles in Chart.js graph on Next.js app 在 vercel 上部署我的 next.js 项目,找不到模块“react-icons/Fa”或其相应的类型声明 - deploy my next.js project on vercel, Cannot find module 'react-icons/Fa' or its corresponding type declarations 如何判断网站是否使用 next.js? - How to tell if a website is using next.js? 如何在 Next.js 中添加自定义图像占位符? - How can I add custom image placeholders in Next.js? Uikit 带有 React 的图标和 Next.js - Uikit Icons with React and Next.js 如何在 Next.js 网站中添加 Docusaurus 网站作为路由 - How to add a Docusaurus website within Next.js Website as a route React.js / Next.js - 如何从一篇文章链接到另一篇文章? - React.js / Next.js - how to link from one article to another? 在 React/Next.js 中,如何简单地将数据从一个页面的组件传递到另一个页面上的组件? - How can I simply pass data from a component one page to a component on another page in React/Next.js? 如何在 React(Next.js) 中使用具有不同查询字符串的另一个 GET 请求时维持来自 DB 的数据? - How do I sustain data from DB while using another GET request with different query string in React(Next.js)? 如何在 Next.js 中的 Link 之前添加一个空格? - How to add a space before Link in Next.js?
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM