将动态“href”从 mdx 传递到 NextJs“Anchor”自定义样式组件

Question

我正在尝试通过 MDX 访问降价标签中的“href”数据并进入自定义样式的 NextJS 组件。

此刻我希望有人能用markdown写：

[Website](http://www.website.com)

并将数据放入自定义样式组件中，如下所示：

./components/md/Anchor.tsx 

function Anchor({ text }) {
 
  return <a className="text-blue-600 my-4 text-base" href={???} target="_blank" rel="noopener">{text}</a>;
}
export default Anchor;

我需要能够将“http://website.com”传递给 Anchor 组件。

目前我只能点击没有活动链接的{text}，但它的样式正确。

理想情况下，我根本不需要改变 markdown 语法来实现这一点。有什么建议吗？

我想也许可以尝试将 href 数据通过

meta

或

frontmatter

作为一种方法来做到这一点。