后台的php请求就是接收这两个参数

login.vue

<template><div class=''> <input type="text" v-model="name" /> <input type="password" v-model="password" /> <button type="primary" @click="submitForm"><router-link :to="{path:'/'}">提交</router-link></button></div></template><script>import axios from 'axios'; export default { data(){ return{ name:'', password:'', } }, methods:{ submitForm:function(){ var params = new URLSearchParams(); params.append('name', this.name); params.append('password',this.password); axios({ method: 'post', url: '/api/bbb.php', data:params }).then((resp)=>{ sessionStorage.setItem('token',resp.status)// localStorage //以key value的形式将值存放到sessionStorage中。 console.log(resp); }).catch((error)=>{ console.log(error); }) } } }</script>

router

{ path: '/', name: 'HelloWorld', component: HelloWorld, meta:{requireAuth:true} },

main.js

router.beforeEach((to, from, next) => { console.log(to); console.log(from); console.log( sessionStorage.getItem('token')) if (to.meta.requireAuth) { // 判断该路由是否需要登录权限 if(sessionStorage.getItem('token')){ //判断sessionStorage是否存在token alert("已经登录了") next(); }else{ //防止死循环 alert("暂时未登录") if (to.path === '/login') { next(); return }else{ next({ path: '/login', }); } } } else { next(); } if(to.fullPath == "/login"){ if(localStorage.getItem('token')){ next({ path:from.fullPath }); }else { next(); } }});

注意一定要在router实例前使用

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。