当使用Grommet Anchor作为来自react-router-dom的链接时，摆脱浏览器警告

Question

Grommet Anchor＆＃39;标签＆＃39;属性类型需要＆＃39; string＆＃39;，因此使用来自react-router-dom的链接会创建一个控制台警告。除了警告，一切正常。

  

警告：道具类型失败：tag类型的道具function无效   提供给Anchor，预计string。

代码：

import {Link} from 'react-router-dom';
...
<Anchor key={route.key} tag={Link} to={route.path} children={route.mainMenuLabel}/>

文档说：

  

tag {string}用于元素的DOM标记。该   默认是。这应该与组件一起使用   比如来自React Router的链接。在这种情况下，链接控制   Anchor控制样式时导航。默认值为。

＆＃34; grommet-css＆＃34;：＆＃34; ^ 1.6.0＆＃34;

我做错了什么，是否有可能摆脱警告？

Answer 1

如果你想使用反应路由器的path功能而不是渲染链接组件本身，那么就可以这样做。

import Anchor from 'grommet/components/Anchor';

<Anchor icon={<Edit />}
  label='Label'
  path='/'   //  Give the react-router path here.
/>

如果必须绝对渲染Link组件，那么

<Link to='/'>
  <Anchor tag="span">Home</Anchor>
</Link>

Tag需要一个字符串，不能用于呈现链接。