在nextJs中使用链接时出现"Warning: Function components cannot be given refs"错误

Question

警告:函数组件不能给出ref。尝试访问此ref将失败。你的意思是使用React.forwardRef()吗?

我得到这个错误时，在nextJs当我包装一个图像标签内的链接标签:

<Link href="/">
<Image src={logo} width={50} height={50} className="btn rounded-full bg-transparent" />
</Link>

Answer 1

这个错误意味着你传递的元素不能用来转发ref，所以使用任何允许转发ref的元素都可以。在这种情况下，通常将它包装在<a>标记中。例如

<Link>
<a>
<Image />
</a>
</Link>