这是一个vue create 文件名 出来的文件,那最外层的就在这个app.js中
在这里插入图片描述
在这里插入图片描述
这一部分是下图home|about,如果存在这一部分 ,整个vue被分为标题和 一下 的内容页面;如果 删掉这一部分,整个页面统一为一个页面。
在这里插入图片描述
在这里插入图片描述
router-view是路由跳转到页面。
我们在查看 router文件夹下index.js文件
在这里插入图片描述
这里规定了跳转位置,以及配置路由
在这里插入图片描述
说明当http://192.168.1.27:8080/ 端口号后面是‘/’时,会跳转到Home页面
在这里插入图片描述
这里规定了Home对应的文件


路由守卫代码

router.beforeEach(function (to, from, next) {
  if (to.meta.needLogin) {
    // 页面是否登录
    if (localStorage.getItem('token')) {
      console.log('存在token')//  本地存储中是否有token(uid)数据
      next()// 表示已经登录
    } else {
      console.log('不存在,需要登录')//  next可以传递一个路由对象作为参数 表示需要跳转到的页面
      next({
        name: '/login'
      })
    }
  } else {
    console.log('未进行路由判定')//  表示不需要登录
    next()// 继续往后走
  }
})
Logo

前往低代码交流专区

更多推荐