当前位置:   article > 正文

云监控(华为) | 实训学习day3(10)

云监控(华为) | 实训学习day3(10)

实现数据的增删改查

SpringBoot框架模式

向送外卖一样理解

写程序

1、准备食材(java bean)

2、菜谱(pojo接口->预制->sql 语句)  

3、service处理

4、controller 派送

5、用户请求->页面

一、Spring Boot实现增加

第一步:食材(表),用户增加,这里还是用户表,这是MyUseràbean

第二步:pojo里增加(添加的方法,)预制菜---Mapper

先写一个接口:

第三步:解冻(接口执行的sql语句)

为xml的增加insert语句

注意:
  1. mapper的java接口名与xml 的文件名必须一致
  2. mapper接口增加的方法在xml中必须有一个id对应
  3. 注意返回值和参数值,如果接口中有返回值,xml有resultType,如果有接口有参数值,xml中有parameterType
  4. mapper标签的namespace必须指示到对应的mapper接口类中。
  5. 执行增删改操作必须有参数,参数类型指示的是bean中的类型,在模板#{}使用bean中类属性就可以。

resultType(有返回值的)

parameterType(没有返回值,参数的)

第四步:service的编写,基本程序Service与Mapper代码相似,直接调用

第五步: Controller编写

Controller写路由(地址)

第六步:前端页面

必须输入添加的数据,用户交互没有添加功能,添加功能就是用户输入用户名和密码,这个功能只与Controller有关系,与数据库无关。这里增加一个显示页面的方法

有了地址后,添加addpage页面

用户不能输入id,只能输入username,password

修改sql的代码如下.

最后得到前端的页面代码

注意:

前端页面代码中的input属性必须有name属性,不然后端接收不到,并且名称与java bean的名称一致。

清楚访问地址

http://localhost:8080/user/addpage

提交后:添加到数据库的用户列表页

注册后,得到用户列表页

二、用户表的删除

1、准备食材(java bean)

2、菜谱(pojo接口->预->sql 语句) 

3、service处理

4、controller 派送

5、用户请求->页面

 第一步:表:用户表,MyUser

 第二步:实现接口 UserMapper

第三步:改UserMapper对应的xml,写sql语句

 第四步: Service代码和Mapper代码,Service代码写实现

  第五步,controller调用service方法即可

在逻辑中,删除结束后返回原来的用户列表页.

 第六步,前端页面的处理

常识:

一般删除发生在用户列表页,删除某项就击“删除”键

前端页面首先在列表中有删除按钮

   

得到的页面

删除之前需要确认,确认后删除,需要前端做确认代码。

得到前端代码.

三 、用户表的更新

第一步:分析操作的java bean,还是MyUser,更新的还是用户表

第二步:  解决Mapper问题

在Mapper中加入更新方法

 第三步:  同步 解决Mapper的xml文件

 

第四步:  Service, 与Mapper一致,这里的Service是需要实现

 

第五步:  Controller, 调用Service方法,返回一个页面

 第六 步:  前端

界面,用户操作明白

修改逻辑一般

  

在前端击修改后先把原始数据放在页面中显示,然后根据需求去

改。

先把修改按钮放在页面上

需求中出现原始数据的显示地址,地址是Controller的事情.

到Controller后,发现还需要显示需要修改的原始数据。

这里需要调用Service的逻辑, Service就调用Mapper,Mapper 实现sql语句,Mapper功能按  修改的id找原始数据.

 决定Mapper中多加一人方法

Mapper文件发生改变,Mapper的xml发生改变

 

完成Mapper,写Service,Service逻辑与Mapper类似,需要代码实现。

 

完成Serivce后,就可以写Controller调用

最后是前端,需要创建一个updatepage的页面

 

最后调整用户列表页

注释:

 上面页面widow.location.href少一个h

 效果如下

更新页面

代码详解:

addpage.html

  1. <!DOCTYPE html>
  2. <html lang="en" xmlns="http://www.w3.org/1999/html">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>添加用户</title>
  6. </head>
  7. <body>
  8. <!--action 是提交地址,决定有哪个逻辑来进行处理-->
  9. <!--用户是不可以输入id的,所以修改xml-->
  10. <form action="/user/add" method="post">
  11. 用户名:<input type="text" name="username"/></br>
  12. 密码:<input type="password" name="password"/></br>
  13. <button type="submit">注册</button>
  14. </form>
  15. </body>
  16. </html>

myuser.html

  1. <!DOCTYPE html>
  2. <html xmlns:th="http://www.thymeleaf.org">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>显示用户</title>
  6. </head>
  7. <body>
  8. <table>
  9. <tr>
  10. <td>id</td>
  11. <td>用户名</td>
  12. <td>用户密码</td>
  13. <td>操作</td>
  14. </tr>
  15. <tr th:each="item:${myusers}">
  16. <td th:text="${item.id}"></td>
  17. <td th:text="${item.username}"></td>
  18. <td th:text="${item.password}"></td>
  19. <td>
  20. <button type="button" th:onclick="|ondel(${item.id})|" >删除</button>
  21. <button type="button" th:onclick="|onupdate(${item.id})|">修改</button>
  22. </td>
  23. </tr>
  24. </table>
  25. <script>
  26. function onupdate(id){
  27. //修改不需要跳转,显示原始信息
  28. window.location.href="/user/orign?id="+id;
  29. }
  30. function ondel(id){
  31. //先确认是否删除
  32. answer=confirm("是否需要执行删除操作?")
  33. if(answer==true){
  34. // 地址栏地址
  35. window.location.href="/user/del?id="+id;
  36. }
  37. }
  38. </script>
  39. </body>
  40. </html>

updatepage.html

  1. <!DOCTYPE html>
  2. <html lang="en" xmlns:th="http://www.thymeleaf.org" >
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>更新页面</title>
  6. </head>
  7. <body>
  8. <form action="/user/update" method="post">
  9. <input type="hidden" th:value="${oneuser.id}" name="id"/>
  10. 用户名:<input type="text" th:value="${oneuser.username}" name="username"/><br/>
  11. 密码:<input type="password" th:value="${oneuser.password}" name="password" /><br/>
  12. <button type="submit">更新</button>
  13. </form>
  14. </body>
  15. </html>

controller>UserController

  1. package com.controller;
  2. import com.bean.MyUser;
  3. import com.service.UserService;
  4. import org.springframework.beans.factory.annotation.Autowired;
  5. import org.springframework.stereotype.Controller;
  6. import org.springframework.ui.Model;
  7. import org.springframework.web.bind.annotation.RequestMapping;
  8. import java.util.ArrayList;
  9. import java.util.List;
  10. @Controller
  11. @RequestMapping("/user")
  12. public class UserController {
  13. @Autowired
  14. private UserService userservice;
  15. @RequestMapping("/list")
  16. public String ListUser(Model model) {
  17. List<MyUser> users = userservice.selectUser();
  18. System.out.println("users");
  19. model.addAttribute("myusers", users);
  20. return "myuser";
  21. }
  22. //指定地址添加requstmapping,方法最终返回页面,需要字符串,代表页面名称
  23. //处理用户的添加,参数还需要用户输入
  24. @RequestMapping("/add")
  25. public String addUser(MyUser user){
  26. userservice.addUser(user);
  27. //把数据添加成功之后,需要查看数据是否添加成功,返回查看页面,返回到list显示的页面
  28. //list地址逻辑已完成,没有必要再写
  29. return "forward:/user/list";
  30. }
  31. //给用户输入数据的页面,再给一个请求地址,专门显示页面的,与数据库无关
  32. @RequestMapping("/addpage")
  33. public String addpage(){
  34. return "addpage";
  35. }
  36. // 删除方法的路由
  37. @RequestMapping("/del")
  38. public String deleteUser(int id){
  39. userservice.deleteUser(id);
  40. // 操作后返回查询页面
  41. return "forward:/user/list";
  42. }
  43. //修改用户表的路由
  44. @RequestMapping("/update")
  45. public String updateUser(MyUser user){
  46. userservice.updateUser(user);
  47. return "forward:/user/list";
  48. }
  49. @RequestMapping("/orign")
  50. public String showUser(int id,Model model) {
  51. MyUser myuser = userservice.selectUserById(id);
  52. model.addAttribute("oneuser",myuser);
  53. return "updatepage";
  54. }
  55. }

pojo>UserMapper

  1. package com.pojo;
  2. import com.bean.MyUser;
  3. import org.apache.ibatis.annotations.Mapper;
  4. import java.util.List;
  5. @Mapper
  6. public interface UserMapper {
  7. public List<MyUser> selectUser();
  8. public void addUser(MyUser user);
  9. public void deleteUser(int id);
  10. public void updateUser(MyUser user);
  11. public MyUser selectUserById(int id);
  12. }

service>userservice

  1. package com.service;
  2. import com.bean.MyUser;
  3. import com.pojo.UserMapper;
  4. import org.springframework.beans.factory.annotation.Autowired;
  5. import org.springframework.stereotype.Service;
  6. import java.util.List;
  7. @Service
  8. public class UserService {
  9. @Autowired
  10. private UserMapper usermapper;
  11. public List<MyUser> selectUser(){
  12. return usermapper.selectUser();
  13. }
  14. public void addUser(MyUser user){
  15. //有返回值加return,没有返回值直接调用
  16. usermapper.addUser(user);
  17. }
  18. public void deleteUser(int id){
  19. // service中直接调用mapper方法
  20. usermapper.deleteUser(id);
  21. }
  22. public void updateUser(MyUser user){
  23. usermapper.updateUser(user);
  24. }
  25. public MyUser selectUserById(int id){
  26. return usermapper.selectUserById(id);
  27. }
  28. }

mybatis>UserMapper

  1. <?xml version="1.0" encoding="UTF-8"?>
  2. <!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
  3. "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
  4. <mapper namespace="com.pojo.UserMapper">
  5. <select id="selectUser" resultType="com.bean.MyUser">
  6. select * from myuser
  7. </select>
  8. <insert id="addUser" parameterType="com.bean.MyUser">
  9. insert into myuser(username,password) values (#{username},#{password})
  10. </insert>
  11. <!--这里的参数只有id值,直接在模板使用id值-->
  12. <delete id="deleteUser" parameterType="int">
  13. delete from myuser where id=#{id}
  14. </delete>
  15. <update id="updateUser" parameterType="com.bean.MyUser">
  16. update myuser set username=#{username},password=#{password} where id=#{id}
  17. </update>
  18. <select id="selectUserById" parameterType="int" resultType="com.bean.MyUser">
  19. select * from myuser where id=#{id}
  20. </select>
  21. </mapper>

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/IT小白/article/detail/877687
推荐阅读
相关标签