在组件属性中内联使用React.forwardRef是否有效？

如何解决在组件属性中内联使用React.forwardRef是否有效？

代码

const TopLabel = ({ innerRef,...props }) => {
  console.log(innerRef);
  return <Fragment>Top label</Fragment>;
};

export default function TabsWrappedLabel() {
  return (
    <AppBar position="static">
      <Tabs aria-label="wrapped label tabs example">
        <Tab
          value="one"
          component={React.forwardRef((props,ref) => (
            <TopLabel {...props} innerRef={ref} />
          ))}
        />
      </Tabs>
    </AppBar>
  );
}

这会在每次重新渲染和实例化React.forwardRef时引起问题吗？还是内联使用它完全可以吗？

否则应如何使用？

Demo