代码模版-登录成功后跳转首页

**登录成功后跳转首页的代码模版**

###1. 前言在开发一个Web应用程序时，经常需要实现用户登录功能。登录成功后，通常需要跳转到首页或其他指定页面。下面我们将提供一个基本的代码模版，示范如何实现登录成功后跳转首页。

###2. 技术栈本例中，我们使用以下技术栈：

* 后端：Spring Boot* 前端：Vue.js* 数据库：MySQL###3. 登录逻辑首先，我们需要定义一个登录接口，用于处理用户登录请求。我们将使用 Spring Boot 来实现后端逻辑。

#### **LoginController.java**

java// Import necessary packagesimport org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RestController;

@RestControllerpublic class LoginController {

 // Define a login method to handle user login requests @PostMapping("/login")
 public String login(@RequestBody User user) {
 // Simulate database query to verify user credentials if (user.getUsername().equals("admin") && user.getPassword().equals("password")) {
 return "Login successful";
 } else {
 return "Invalid username or password";
 }
 }

 // Define a class to represent the user object public static class User {
 private String username;
 private String password;

 public String getUsername() {
 return username;
 }

 public void setUsername(String username) {
 this.username = username;
 }

 public String getPassword() {
 return password;
 }

 public void setPassword(String password) {
 this.password = password;
 }
 }
}

vue// Import necessary packages<template>
 <div>
 <!-- Login form -->
 <form @submit.prevent="login">
 <input type="text" v-model="username" placeholder="Username">
 <input type="password" v-model="password" placeholder="Password">
 <button type="submit">Login</button>
 </form>

 <!-- Redirect to homepage after login success -->
 <script>
 export default {
 data() {
 return {
 username: '',
 password: ''
 }
 },
 methods: {
 async login() {
 try {
 // Send a POST request to the /login endpoint const response = await axios.post('/login', { username, password });
 if (response.data === 'Login successful') {
 // Redirect to homepage after login success this.$router.push({ name: 'Home' });
 } else {
 alert('Invalid username or password');
 }
 } catch (error) {
 console.error(error);
 }
 }
 }
 };
 </script>
 </div>
</template>

// Import necessary packages<script src=" />