vue路由（十一）vue路由： 判断是否登录，未登录跳转到登录页

 

本次分享的主要点有以下几个

1.大概逻辑思路

1.1 登录成功以后（保存token令牌）进入home首页，进行各种操作。
1.2 退出登录（清除token令牌）返回到登录页面。
1.3 直接在浏览去访问一个页面内的路由地址，（有token令牌），则跳转到目标页面
1.4 直接在浏览去访问一个页面内的路由地址，（没有token令牌），则跳转到login页面登录，登录以后跳转到目标页面
1.5 如果有token，页面不对，直接跳转到404页面

2 logon页面 进行登录验证，保存token

 

<template>
  <div id="app" style="margin: 0px; line-height: 34px; width: 800px">
    <h3>登录页面</h3>
    <el-form
      :model="ruleForm"
      status-icon
      ref="ruleForm"
      label-width="100px"
      c