实习笔记 —— SSM三个框架的整合 IV

系列文章目录

实习笔记 —— Spring基础
实习笔记 —— IOC反转控制(xml配置文件 + 注解)
实习笔记 —— AOP开发I
实习笔记 —— AOP开发II(AOP中Advice的类型)
实习笔记 —— MyBatis I (MyBatis基础)
实习笔记 —— MyBatis II (MyBatis基本数据库操作)
实习笔记 —— MyBatis III(输入/输出映射)
实习笔记 —— MyBatis IV(动态SQL)
实习笔记 —— MyBatis V(多表查询)
实习笔记 —— Git I(基础指令)
实习笔记 —— Git II(远程提交)
实习笔记 —— Maven
实习笔记 —— springMVC I
实习笔记 —— springMVC部分II
实习笔记 —— SSM三个框架的整合 I (简单登录功能)
实习笔记 —— SSM三个框架的整合 II (根据数据库账号密码进行登录)
实习笔记 —— SSM三个框架的整合 III (对后台管理页面进行编写)


文章目录

  • 系列文章目录
  • 一、查出评论关联的文章信息
  • 二、创建“全部文章”页面
    • 1.前端
    • 2.Maven
    • 3.回到前端
    • 4.后端
  • 总结


一、查出评论关联的文章信息

①修改接口:
/ssm-blog/src/main/java/com/mapper/ArticleMapper.java
实习笔记 —— SSM三个框架的整合 IV_第1张图片
②修改映射配置文件:
/ssm-blog/src/main/java/com/mapper/ArticleMapper.xml
实习笔记 —— SSM三个框架的整合 IV_第2张图片
③修改CommentServiceImpl:

没改CommentService接口,直接改实现类了?

实习笔记 —— SSM三个框架的整合 IV_第3张图片
④测试:

http://localhost:8080/ssm-blog/admin/login

实习笔记 —— SSM三个框架的整合 IV_第4张图片
实习笔记 —— SSM三个框架的整合 IV_第5张图片
获取到了评论对应的文章标题。

二、创建“全部文章”页面

目标样式:
实习笔记 —— SSM三个框架的整合 IV_第6张图片

1.前端

①改index页侧导航的路径:
实习笔记 —— SSM三个框架的整合 IV_第7张图片
改成

<a href="article">全部文章</a>

②新建Controller:
实习笔记 —— SSM三个框架的整合 IV_第8张图片
③创建“全部文章”页面对应的jsp:

/ssm-blog/src/main/webapp/jsp/Article/article-list.jsp

实习笔记 —— SSM三个框架的整合 IV_第9张图片
④测试一下:
实习笔记 —— SSM三个框架的整合 IV_第10张图片

http://localhost:8080/ssm-blog/admin/login

实习笔记 —— SSM三个框架的整合 IV_第11张图片

2.Maven

①在pom中添加依赖:


<dependency>
       <groupId>com.github.pagehelpergroupId>
       <artifactId>pagehelperartifactId>
       <version>4.2.1version>
dependency> 

②在/ssm-blog/src/main/resources/mybatis/mybatis-config.xml进行配置:
实习笔记 —— SSM三个框架的整合 IV_第12张图片

3.回到前端

①修改/ssm-blog/src/main/webapp/jsp/Article/article-list.jsp:
实习笔记 —— SSM三个框架的整合 IV_第13张图片
②测试:
实习笔记 —— SSM三个框架的整合 IV_第14张图片
注意连接已经变了:

http://localhost:8080/ssm-blog/article

③更换主体内容:

从老师给的静态模板找
/ssm-blog/src/main/webapp/static_静态页面html/1.全部文章.html:

实习笔记 —— SSM三个框架的整合 IV_第15张图片
粘贴到/ssm-blog/src/main/webapp/jsp/Article/article-list.jsp

4.后端

①Mapper接口:

/ssm-blog/src/main/java/com/mapper/ArticleMapper.java
实习笔记 —— SSM三个框架的整合 IV_第16张图片


②映射配置文件:

/ssm-blog/src/main/java/com/mapper/ArticleMapper.xml

在这里插入图片描述


③service:

/ssm-blog/src/main/java/com/service/ArticleService.java
实习笔记 —— SSM三个框架的整合 IV_第17张图片


④serviceImpl: /ssm-blog/src/main/java/com/service/impl/ArticleServiceImpl.java ![在这里插入图片描述](https://img-blog.csdnimg.cn/cdc45ca3c31743bcbd5699ed4eda9d99.png)
⑤修改/ssm-blog/src/main/java/com/controller/ArticleController.java

实习笔记 —— SSM三个框架的整合 IV_第18张图片


⑥将获取到的数据传至前端:

修改/ssm-blog/src/main/webapp/jsp/Article/article-list.jsp:

总结

设计 “全部文章” 页面的总体流程:

①先解决前端跳转问题,首先得能跳转到 “全部文章” 页面。
②完善跳转到的页面,使用老师给的静态模板。
③进入后端,在数据库获取全部文章。
④将获取到的文章推到前端 “全部文章” 页面。

你可能感兴趣的:(2022实习,java,github,git,spring,eclipse)