访问nextjs中的动态查询参数

Question

我有一个带有nextjs的项目，我有一条这样的路线=>类别/224？brand[0]＝6。我想知道这个查询什么时候更改过Example/categies/224？brand[0]=8我的使用效果再次运行这是我的用途效果

const router = useRouter();
useEffect(()=>{
console.log('hey there');
},[])

我不希望我的useEffect在整个router.query更改时运行，我只是在router.query.brand[0]更改时运行。

Answer 1

首先简单的答案是将要控制useEffect的变量放在其依赖数组中

useEffect(() => {
console.log('hello')
}, [router.query.brand])

正如juiliomalves所指出的。

现在，router.query.brand中的每一个更改都将触发此useEffect代码。然而，其他路由器更改可能会影响页面，无论您的使用效果如何。

Answer 2

const router = useRouter();
useEffect(()=>{
console.log('hey there');
},[])