mybatis+thymeleaf登录

目录

一.将页面显示在浏览器中

1.新建项目并导入页面

2.使用th标签

3.新建控制层

4.显示结果

二.将两个页面进行关联

1.提交表单

2.跳转页面

3.结果

三.登录账号名动态改变

1.获取登录表单数据

2.给页面传值

3.页面显示

4.结果

四.连接数据库

1.新建数据库

2.分别建立访问层,实体类,实现类和数据库配置文件

3.连接数据

4.登录判断

5.结果


一.将页面显示在浏览器中

1.新建项目并导入页面

2.使用th标签

首先在html标签中引入th标签

<html xmlns:th="http://www.thymeleaf.org">

将页面中部分修改为th标签

th:href="@{css/public.css} -----css使用

th:src="@{/img/clock.jpg}" -----图片使用

th:src="@{/js/time.js}" -----js引用

th:action="@{/}" -----表单提交

th:href="@{/login}" -----页面跳转

此时需指向服务器路径login

3.新建控制层

在Controller包中新建文件,控制页面

@Controller
public class UserController {

    @RequestMapping("/")
    public String goindex(){
        return "index";
    }

    @RequestMapping("/login")
    public String gologin(){
        return "login";
    }

}

4.显示结果

二.将两个页面进行关联

1.提交表单

将登录时的表单提交到首页(默认页面)。

其中, 是提交from表单,提交到th:action="@{/}",/为首页路径。

<section class="loginCont">
            <form class="loginForm" th:action="@{/}">
                <div class="inputbox">
                    <label for="user">用户名:</label>
                    <input id="user" type="text" name="username" placeholder="请输入用户名" />
                </div>
                <div class="inputbox">
                    <label for="mima">密码:</label>
                    <input id="mima" type="password" name="password" placeholder="请输入密码" />
                </div>
                <div class="subBtn">
                    <input type="submit" value="登录" />
                    <input type="reset" value="重置"/>
                </div>
            </form>
        </section>

2.跳转页面

此时,href标签找到控制层的服务器路径,通过路径,找到其中的页面。

<a th:href="@{/login}">退出</a>

 

@RequestMapping("/login")
    public String gologin(){
        return "login";
    }

3.结果

此时点击登录即可进入首页,首页也可退出返回登录页。

三.登录账号名动态改变

1.获取登录表单数据

页面中可知,表单将提交到首页页面,所以在首页获取

@RequestMapping("/")
    public String goindex(User user){
        System.out.println(user.getUsername()+"  "+user.getPassword());
        return "index";
    }

2.给页面传值

获取到后,将名字传值给页面

@RequestMapping("/")
    public ModelAndView goindex(User user){
        System.out.println(user.getUsername()+"  "+user.getPassword());
        ModelAndView mav =new ModelAndView();
        mav.addObject("name",user.getUsername());
        mav.setViewName("index");
        return mav;
    }

3.页面显示

页面即可获取数据,并以文字显示

<h2 th:text="${name}">Admin</h2>

4.结果

四.连接数据库

1.新建数据库

create database if not exists my_sql;
use my_sql;
create table if not exists User
(
    userID   int primary key auto_increment,
    username varchar(20)     not null,
    password varchar(20)     not null
);

insert into User value
    (1,  'sean', '123456'),
    (2,  '李四', '123456'),
    (3, '王五', '123456'),
    (4, 'sean1', '111111');

2.分别建立访问层,实体类,实现类和数据库配置文件

方法一:按照之前方法,自行建包、接口、类和xml文件

方法二:安装EasyCode插件

使用插件生成

生成所有需要文件

3.连接数据

实体类

/**
 * (User)实体类
 *
 * @author makejava
 * @since 2024-03-11 15:39:45
 */
@Data
public class User implements Serializable {
    private static final long serialVersionUID = 157892786167003600L;
   
    private Integer userid;
   
    private String username;
   
    private String password;

}

接口

/**
 * (User)表数据库访问层
 *
 * @author makejava
 * @since 2024-03-11 15:39:44
 */

@Mapper
public interface UserDao {
    public List<User> getUser();
}

对外暴露接口

/**
 * (User)表服务接口
 *
 * @author makejava
 * @since 2024-03-11 15:39:45
 */

@Mapper
public interface UserService {
    public List<User> getUser();
}

接口实现类

/**
 * (User)表服务实现类
 *
 * @author makejava
 * @since 2024-03-11 15:39:46
 */
@Service
public class UserServiceImpl implements UserService {
    @Autowired
    UserDao userDao;

    @Override
    public List<User> getUser() {
        return userDao.getUser();
    }
}

myBaits配置

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="com.example.lianxi.dao.UserDao">

    <!--查询单个-->
    <select id="getUser" resultType="list">
        select
          userID, username, password
        from user
    </select>
</mapper>

控制层

/**
 * (User)表控制层
 *
 * @author makejava
 * @since 2024-03-11 15:39:43
 */
@Controller
public class UserController {
    @Autowired
    UserServiceImpl userService;

    @RequestMapping("/")
    public ModelAndView goindex(User user){
        System.out.println(user.getUsername()+"  "+user.getPassword());
        ModelAndView mav =new ModelAndView();
        mav.addObject("name",user.getUsername());
        mav.setViewName("index");
        return mav;
    }

    @RequestMapping("/login")
    public String gologin(){
        return "login";
    }

}

4.登录判断

根据输入的名字和密码查询,如果列表为空,则登录失败,否则,登录成功

@RequestMapping("/")
    public ModelAndView goindex(User user){
        System.out.println(user.getUsername()+"  "+user.getPassword());
        ModelAndView mav =new ModelAndView();
        User login = userService.login(user);
        if (login!=null){
            mav.addObject("name",user.getUsername());
            mav.setViewName("index");
        }else {
            mav.addObject("error","用户名和密码错误");
            mav.setViewName("login");
        }
        return mav;
    }

5.结果

失败:

成功:

  • 28
    点赞
  • 13
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

随便1007

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值