SSM项目实战-登录验证成功并路由到首页面,Vue3+Vite+Axios+Element-Plus技术

1、util/request.js

import axios from "axios";

let request = axios.create({
    baseURL: "http://localhost:8080",
    timeout: 50000
});

export default request

2、api/sysUser.js

import request from "../util/request.js";

export const login = (data) => {
    return request.post('/sysUser', data);
}

3、components/Login.vue





 SSM项目实战-登录验证成功并路由到首页面,Vue3+Vite+Axios+Element-Plus技术_第1张图片

 4、router.push()

在Vue.js 3中,router.push仍然是一个非常重要的方法,用于导航到新的路由。这是Vue Router库的一部分,用于管理应用程序的路由。

router.push的主要作用是:

  1. 导航到新路由:当你在应用程序中想要导航到新的页面或者路由时,可以使用router.push。你可以传递一个路由配置对象,或者一个字符串路径作为参数。
  2. 编程式导航:与这样的HTML标签相比,router.push是一种编程式导航的方式。这意味着你可以在JavaScript代码中动态地决定要导航到的路由。
  3. 处理回退:如果用户尝试访问他们之前访问过的页面,并且没有新的路由可供导航,那么router.push会处理回退,并导航到前一个路由。
  4. 处理重定向:你可以使用router.push来重定向到一个新的路由,即使这个路由在当前的路由配置中不存在。

下面是一个使用router.push的简单示例:

import { router } from './router'  
  
// 通过传递一个字符串路径进行导航  
router.push('/home')  
  
// 通过传递一个路由配置对象进行导航  
router.push({ path: '/user' })

请注意,在Vue3中,你需要使用createWebHistory()来创建一个HTML5 history对象,并传递给Vue Router的构造函数,以便能够使用router.push进行导航。

你可能感兴趣的:(SSM整合实战,Vue3,Vite,axios.create,baseURL,request.post,response.data,router.push)