SpringBoot+MybatisPlus+MySQL展示数据到前端页面

1、准备数据（用python爬取某动漫网站下的数据）

2、创建springboot项目

3、pom.xml

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 https://maven.apache.org/xsd/maven-4.0.0.xsd">
    <modelVersion>4.0.0</modelVersion>
    <parent>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-parent</artifactId>
        <version>2.4.5</version>
        <relativePath/> <!-- lookup parent from repository -->
    </parent>
    <groupId>com.zou</groupId>
    <artifactId>reptile_show</artifactId>
    <version>0.0.1-SNAPSHOT</version>
    <properties>
        <java.version>1.8</java.version>
    </properties>
    <dependencies>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter</artifactId>
        </dependency>

        <dependency>
            <groupId>org.projectlombok</groupId>
            <artifactId>lombok</artifactId>
            <optional>true</optional>
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-test</artifactId>
            <scope>test</scope>
        </dependency>

        <!--mybatis-plus相关依赖-->
        <dependency>
            <groupId>com.baomidou</groupId>
            <artifactId>mybatis-plus-boot-starter</artifactId>
            <version>3.4.2</version>
        </dependency>
        <dependency>
            <groupId>mysql</groupId>
            <artifactId>mysql-connector-java</artifactId>
            <version>6.0.5</version>
        </dependency>
        <dependency>
            <groupId>com.alibaba</groupId>
            <artifactId>druid</artifactId>
            <version>1.1.10</version>
        </dependency>
        <dependency>
            <groupId>junit</groupId>
            <artifactId>junit</artifactId>
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-test</artifactId>
        </dependency>
        <dependency>
            <groupId>org.springframework</groupId>
            <artifactId>spring-test</artifactId>
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-web</artifactId>
        </dependency>

        <!--引入jsp相关-->
        <dependency>
            <groupId>javax.servlet.jsp</groupId>
            <artifactId>jsp-api</artifactId>
            <version>2.2</version>
        </dependency>
        <!--引入jstl-->
        <dependency>
            <groupId>jstl</groupId>
            <artifactId>jstl</artifactId>
            <version>1.2</version>
        </dependency>
        <!--内置tomcat对Jsp支持的依赖，用于编译Jsp-->
        <dependency>
            <groupId>org.apache.tomcat.embed</groupId>
            <artifactId>tomcat-embed-jasper</artifactId>
        </dependency>
        <!-- spring boot tomcat jsp 支持开启  -->
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-tomcat</artifactId>
        </dependency>
    </dependencies>

    <build>
        <plugins>
            <plugin>
                <groupId>org.springframework.boot</groupId>
                <artifactId>spring-boot-maven-plugin</artifactId>
                <configuration>
                    <excludes>
                        <exclude>
                            <groupId>org.projectors</groupId>
                            <artifactId>lombok</artifactId>
                        </exclude>
                    </excludes>
                </configuration>
            </plugin>
        </plugins>
    </build>

</project>

4、编写实体类

package com.zou.entity;

import com.baomidou.mybatisplus.annotation.IdType;
import com.baomidou.mybatisplus.annotation.TableId;
import com.baomidou.mybatisplus.annotation.TableName;
import lombok.AllArgsConstructor;
import lombok.Data;
import lombok.NoArgsConstructor;

/**
 * @author: 邹祥发
 * @date: 2021/5/18 13:10
 */
@Data
@AllArgsConstructor
@NoArgsConstructor
@TableName("comic")
public class Comic {
    @TableId(type = IdType.AUTO)
    private Integer did;
    private String name;
    private String url;
    private String type;
    private String author;
}

5、编写mapper类

package com.zou.mapper;

import com.baomidou.mybatisplus.core.mapper.BaseMapper;
import com.zou.entity.Comic;

/**
 * @author: 邹祥发
 * @date: 2021/5/18 13:21
 */
public interface ComicMapper extends BaseMapper<Comic> {
}

6、编写controller类

package com.zou.controller;

import com.zou.entity.Comic;
import com.zou.mapper.ComicMapper;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;

import javax.annotation.Resource;
import java.util.List;

/**
 * @author: 邹祥发
 * @date: 2021/5/18 13:26
 */
@Controller
public class ComicController {

    @Resource
    ComicMapper comicMapper;

    @RequestMapping("/comic")
    public String showAll(Model m) {
        List<Comic> lists = comicMapper.selectList(null);
        m.addAttribute("comic",lists);
//        System.out.println(lists);

        return "comic";
    }
}

7、配置webapp

右击main，创建一个目录webapp，子目录再创建一个WEB-INF，jsp，comic.jsp，如图

新建的webapp目录中心没有蓝点，即没有生效，下面讲解如何使它生效

8、配置yml

server:
  port: 8081
  servlet:
    context-path: /
spring:
  datasource:
    username: root
    password: 123456
    url: jdbc:mysql://localhost:3306/test?useUnicode=true&characterEncoding=utf-8&useSSL=true&serverTimezone=UTC
    type: com.alibaba.druid.pool.DruidDataSource
    driver-class-name: com.mysql.cj.jdbc.Driver
  mvc:
    view:
      suffix: .jsp
      prefix: /WEB-INF/jsp/

9、编写前端页面

<%@ page contentType="text/html;charset=UTF-8" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<html>
<head>
    <title>数据展示页面</title>
</head>
<style>
    body {
        text-align: center;
    }
    table {
        margin: auto;
        border-collapse: collapse;
    }
    table tr td {
        border: solid 1px #222;
    }
</style>
<body>
<table>
    <tr>
        <td>id</td>
        <td>name</td>
        <td>url</td>
        <td>type</td>
        <td>author</td>
    </tr>
    <c:forEach items="${comic}" var="u" varStatus="st">
        <tr>
            <td>${u.did}</td>
            <td>${u.name}</td>
            <td>${u.url}</td>
            <td>${u.type}</td>
            <td>${u.author}</td>
        </tr>
    </c:forEach>
</table>
</body>
</html>

10、SpringBoot主函数

@SpringBootApplication(scanBasePackages = {"com.zou.controller"})
@MapperScan("com.zou.mapper")

11、测试

① 运行springboot主函数

② 在浏览器中输入http://localhost:8081/comic