页面显示

路由↓

import { createRouter, createWebHashHistory } from 'vue-router'
import HomeView from '../views/home/HomeView'
import LoginView from '../views/login/LoginView'
import RegisterView from '../views/register/RegisterView'

const routes = [
  {
    path: '/',
    name: 'Home',
    component: HomeView
  },
  {
    path: '/register',
    name: 'Register',
    component: RegisterView
  }, {
    path: '/login',
    name: 'Login',
    component: LoginView,
    // 只有访问login页面之前才会执行这个函数
    // 每个路由项里面都可以加beforeEnter这个函数
    beforeEnter(to, from, next) {
      const { isLogin } = localStorage;
      // 如果已经登录了，就跳到首页
      // 如果未登录，就正常跳转到登录页面
      isLogin ? next({ name: 'HomeView' }) : next();
    }
  },
  // {
  //   path: '/about',
  //   name: 'about',
  //   // route level code-splitting
  //   // this generates a separate chunk (about.[hash].js) for this route
  //   // which is lazy-loaded when the route is visited.
  //   component: () => import(/* webpackChunkName: "about" */ '../views/AboutView.vue')
  // }
]

const router = createRouter({
  history: createWebHashHistory(),
  routes
})

// router.beforeEach的意思是每次做路由跳转之前，都会执行这个方法，不管什么路由，做切换时都会执行
router.beforeEach((to, from, next) => {
  // 当路由要跳转时，to表示要跳到的页面的信息，from表示从哪里跳过来的信息
  const { isLogin } = localStorage;
  // 页面做跳转前，判断是否登录了，或者要跳到的页面是login页面
  (isLogin || (to.name === 'LoginView' || to.name === 'RegisterView')) ? next() : next({ name: 'LoginView' })
  // next可以理解为中间件继续执行的方法
  // 调用next()表示继续往下执行
  // next();
})

export default router

login页面中的name值是LoginView吗？

需要保持一致，建议再检查下。

这个应该是没问题的，这些都是上一节课程的代码，上节课还是好使的