如何使用React创建动态超链接（href）？

Question

React完全陌生，所以请原谅我的无知。

在此示例中使用ReactStrap。我试图动态定义{url}，使其在自己的jsx文件中src / components下定义的位置：

const NavLink = ({ url },{ children }) => (
  <RSNavLink href={url}>
    {children}
  </RSNavLink>
);

但是当我在其他地方调用该组件时，我可以插入任何想要的超链接：

<NavLink href="/">Hello, World!</NavLink>

我无法找到特定于我所寻找内容的文档（或者至少，我可能没有在寻找正确的东西）。如果有人能指出我正确的方向，那将不胜感激。

Answer 1

在NavLink组件中，您错误地破坏了props的值，并给出了与props完全相同的名称。像这样更改

const NavLink = ({ url ,children }) => (
  <RSNavLink href={url}>
    {children}
  </RSNavLink>
);

 <NavLink url="#">
     Hello World
 </NavLink>

在stackblitz中查看演示