如何将其他变量传递到React.forwardRef

Question

我正在尝试将我的应用程序更新为Material UI V4，并且在为按钮LinkItem生成组件时需要使用React.forwardRef，但是我有一个动态生成的List，需要将'to'字符串作为变量传递/道具。

ListItem生成如下：

<ListItem 
  key={childData.display} 
  button 
  component={(routerProps) => renderLink(childData.link, routerProps)}
>
  <ListItemText primary={childData.display} />
</ListItem>

将renderLink作为prop从父组件传递下来：

renderLink = (link, routerProps) => <Link to={link} {...routerProps} />;

我尝试过：

const renderLink = link = React.forwardRef((props, ref) => <Link to={link} {...props} ref={ref} />)

和：

renderLink = (link, routerProps) => {
  const props = {
    link: link,
    ...routerProps
  };
  return React.forwardRef((props, ref) => <Link to={props.link} {...props} ref={ref} />)
} 

但是这些都不起作用，我不知道该如何做。

相关文档：https://material-ui.com/guides/composition/#caveat-with-refs