import Vue from "vue"
import Router from "vue-router"
import HelloWorld from "@/components/HelloWorld"
import Login from "@/components/Login"
import Account from "@/components/user/Account"
import Course from "@/components/user/Course"
import Order from "@/components/user/Order"
import store from "./../vuex/index"
Vue.use(Router)
const vueRouter = new Router({
routes: [
{
path: "/hello",
name: "HelloWorld",
component: HelloWorld
},
{
path: "/login",
name: "login",
component: Login
},
{
path: "/account",
name: "account",
component: Account
},
{
path: "/course",
name: "course",
component: Course
},
{
path: "/order",
name: "order",
component: Order
},
]
});
vueRouter.beforeEach(function (to, from, next) {
const nextRoute = [ "account", "order", "course"];
const auth = store.state.isLogin;
//3
if (nextRoute.indexOf(to.name) >= 0) {
//
if (store.state.isLogin === 0) {
vueRouter.push({name: "login"})
}
}
next();
});
export default vueRouter
my requirement is to do a login verification route. The default store.state.isLogin is 0. If the login is successful, the store.state.isLogin will become 1. I have defined three test components myself. When the "account"," order", "course", http://localhost:8080/-sharp/account route is like this, the route will automatically jump to the login route. But when I transfer http://localhost:8080/-sharp/login to http://localhost:8080/-sharp/order, I go directly to the order component, but I am not logged in at this time, and the store.state.isLogin in vuex is still 0. When I refresh the page, I jump to http://localhost:8080/-sharp/login. Excuse me, what is the reason for this?