Router.push 重定向但不渲染页面答案

【问题标题】：Router.push redirecting but not rendering the pageRouter.push 重定向但不渲染页面
【发布时间】：2020-07-01 09:42:18
【问题描述】：

您好，我正在尝试在下一个 js 中实现简单的路由。这是我的代码

import React, { useEffect, useState } from "react";
import Router from "next/router";

import NavBar from "../components/NavBar";


function Index() {

  return (
    <div>
      <h1>Hi Guys!! Welcome!!!</h1>
      <h3>Select your role:</h3>
      <div onClick={() => Router.replace("/admin")}>
        Admin
      </div>
    </div>
  );
}

export default Index;

现在，当我单击管理页面时，它会将其重定向到管理页面，但不会呈现组件。我必须在组件上按 Enter 才能呈现它

这是我的管理组件：

import React from 'react';

function Admin(){


    return <h1>Welcome to admin Dashboard</h1>
}

export default Admin;

【问题讨论】：

标签： javascript reactjs next.js

【解决方案1】：

不确定，但您可以尝试改用useRouter

import { useRouter } from 'next/router';

const router = useRouter();
onClick={() => router.push("/admin");

【讨论】：

【解决方案2】：

试试

Router.replace("path to js file", "/admin")

【讨论】：

错误。重试Router.replace(href, as) href - pages 目录内的路径。这是唯一需要的道具 - 将在浏览器 URL 栏中呈现的路径。用于动态路由