я новичок в Next. js и у меня следующая ситуация. я хочу перенаправить пользователя на маршрут /messages
, если он наберет маршрут /messages/123
на основе css медиазапроса, поэтому, если он мобильн, мы не будем перенаправлять, а если он в браузере, то redirect . я пробовал следующий код
import React, { useLayoutEffect } from 'react';
import { useRouter, push } from 'next/router';
import useMediaQuery from '@material-ui/core/useMediaQuery';
import Layout from '../components/Customer/Layout/Layout';
import Chat from '../components/Customer/Chat/Chat';
const Messages = () => {
const { pathname, push } = useRouter();
const matches = useMediaQuery('(min-width:1024px)');
useLayoutEffect(() => {
console.log('I am about to render!');
if (matches && pathname === '/messages') {
console.log('match!');
push('/');
}
}, [matches, pathname, push]);
return (
<Layout currentURL={pathname}>
<Chat />
</Layout>
);
};
export default Messages;
проблема в том, что компонент визуализации дважды перед перенаправлением