Spring Boot + EasyUI 创建第一个项目（一）

创建一个Spring Boot和EasyUI相结合的项目。

一、构建一个Spring Boot项目

二、配置Thymeleaf

Spring Boot Thymeleaf（十一）_thymeleaf 设置字体_人……杰的博客-CSDN博客

三、配置EasyUI

1 下载EasyUI的对应jar包并配置使用EasyUI

新建一个index.html文件，注意这个文件需要放在static目录下，也就是跟easyui在同一个目录，否则放在templates下由于springboot的内部机制，调用接口访问不到会报404，结构如上图所示，浏览器访问这个页面的路径是localhost:8080/index.html。

引入EasyUI：


    <link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
    <link rel="stylesheet" type="text/css" href="../../themes/icon.css">
    <link rel="stylesheet" type="text/css" href="../demo.css">
    <script type="text/javascript" src="../../jquery.min.js">script>
    <script type="text/javascript" src="../../jquery.easyui.min.js">script>

四、项目举例

1 项目框架

2 代码实现

SpringBootMainApplication.java:


package com.xj.main;
 
import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;
import org.springframework.context.annotation.ComponentScan;
 
/**
 * @Author: xjfu
 * @Create: 2023/10/20 7:33
 * @Description: SpringBoot启动类
 */
@ComponentScan("com.xj")
@SpringBootApplication
public class SpringBootMainApplication {
    public static void main(String[] args) {
        try{
            SpringApplication.run(SpringBootMainApplication.class, args);
        }catch (Exception e){
            e.printStackTrace();
        }
    }
}

ThymeleafController.java:


package com.xj.controller;
 
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
 
/**
 * @Author: xjfu
 * @Create: 2023/10/20 7:42
 * @Description:
 */
@RequestMapping("/easyui")
@Controller
public class ThymeleafController {
 
    @RequestMapping("/hello")
    public String sayHello(){
        //启动hello.html页面
        return "hello";
    }
 
    @RequestMapping("/helloPage")
    public String helloPage(){
        //启动helloPage.html页面
        return "helloPage";
    }
}

index.html:


html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Custom Window Tools - jQuery EasyUI Demotitle>
    <link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
    <link rel="stylesheet" type="text/css" href="../../themes/icon.css">
    <link rel="stylesheet" type="text/css" href="../demo.css">
    <script type="text/javascript" src="../../jquery.min.js">script>
    <script type="text/javascript" src="../../jquery.easyui.min.js">script>
head>
<body>
<div id="win" class="easyui-window" title="My Window" style="width:300px;height:100px;padding:5px;">
    Hello! Sprring Boot + easyUI success!
div>
body>
html>

hello.html:


html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Titletitle>
head>
<body>
<h1 th:text="迎您来到Thymeleaf">欢迎您访问静态页面 HTMLh1>
body>
html>

helloPage.html:


html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Custom Window Tools - jQuery EasyUI Demotitle>
    <link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
    <link rel="stylesheet" type="text/css" href="../../themes/icon.css">
    <link rel="stylesheet" type="text/css" href="../demo.css">
    <script type="text/javascript" src="../../jquery.min.js">script>
    <script type="text/javascript" src="../../jquery.easyui.min.js">script>
head>
<body>
<div id="win" class="easyui-window" title="My Window" style="width:300px;height:100px;padding:5px;">
    Hello! Sprring Boot + easyUI success!
div>
body>
html>

3 运行结果

3.1 测试thymeleaf正常

3.2 EasyUI访问方式

3.3 使用thymeleaf访问方式

五、参考

1.SpringBoot集成EasyUI_springboot整合easyui-CSDN博客

2.https://www.cnblogs.com/jingmoxukong/p/10239821.html

3.Easyui 创建简单窗口_EasyUI 教程

相关阅读:
AxureRP制作静态站点发布互联网，实现公网访问【内网穿透】
[管理与领导-102]：经营与管理的关系：攻守关系；武将文官关系；开疆拓土与守护城池的关系；战斗与练兵的关系；水涨船高，水落船低的关系。
day47：C++ day7，异常处理、using的第三种用法、类型转换、lambda表达式、STL标准模板库
最长回文子串
鲜花商城|基于Springboot实现鲜花商城系统
剑指offer 40. 数组中出现次数超过一半的数字
软件工程——名词解释
JAVA——》模拟虚拟机栈溢出
详解 HBase 的常用 API
郑州直销系统开发为什么需要不断地过滤人？

原文地址：https://blog.csdn.net/qq_21370419/article/details/125420740