NextJS 15中React Data Table行点击跳转并传参时出现Invalid Hook Call错误的求助

我正在使用NextJS 15.0，还有React Data Table Component（版本7.6.2），并且已经设置了表格行可点击。当用户点击行时，会调用onHandleClick函数，相关代码如下：

<DataTable
  onRowClicked={onHandleClick}
/>

onHandleClick函数的代码是这样的：

const onHandleClick = (row:any) => {
  const router = useRouter();
  router.push("/");
}

我想要实现两个需求：

• 第一：用户点击行后，要么跳转到新页面，要么加载一个新组件
• 第二：要把数据（也就是onHandleClick函数里的row参数）传递到新页面/组件中，这样我就能用这些数据填充页面/组件并展示给用户

但我运行上面的代码后，浏览器里出现了Invalid Hook Call错误，点击表格行也不会触发跳转。

我尝试过的解决方法： #

• 我尝试在onHandleClick函数内部使用UseEffect()
• 我尝试在组件内部把onClick作为参数传入

这些尝试都没有解决问题。有没有人能给我一些建议？

提前感谢！

备注：内容来源于stack exchange，提问作者CodeNinja