在使用Next.js框架做前端页面开发时,如果想返回到上一页,可以利用useRouter
钩子提供的back()
方法,可以这样做:
import {useRouter} from "next/navigation";
import {Space} from "antd";
import {ArrowLeftOutlined} from '@ant-design/icons';
const {Text} = Typography;
export default function Page() {
const router = useRouter()
const goBack =()=>{
router.back()
}
return (
<>
<Space>
<ArrowLeftOutlined
className=" top-4 left-4 mr-10 text-xl"
style={{fontSize: '28px', color: '#4A2AF0'}}
onClick={goBack}/>
<Text>我参加的大赛</Text>
</Space>
</>
)
}
效果:
当点击蓝色图标时就会返回到上一页