SpringBoot集成EasyUI

前置条件：已成功搭建一个springboot项目，且可以简单的增删改查，启动项目ok，我这边已成功搭建一个简单的spring boot项目，使用lambok插件，集成了mybatis plus和redis，项目地址为 springboot简单Demo，下载可直接使用。

准备工作：

1．去easyui官网下载安装包：

然后把整个解压包放在上面springboot的static目录下，结构如下图所示：

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

3．在controller层写一个简单的增删查改Rest API接口，类上用@RestController注解，接口请求参数使用form表单提交方式，不用加注解@RequestBody，如果加这个注解代表接收的是json，需要在前端提交时加content-type参数设置为application/json，charset=utf-8，由于不是特别熟悉，就采用form表单提交方式，参数前面不加任何注解，否则请求会报415错误,错误如下：

org.springframework.web.HttpMediaTypeNotSupportedException: Content type 'application/x-www-form-urlencoded;charset=UTF-8' not supported

有一个重要的地方需要注意，就是分页查询列表接口时，easyui只支持默认的两个参数total和rows，所以我们自定义分页查询返回的参数需要封装成所需要的参数类型，如下图所示，这样才可以成功展示列表数据，否则接口请求成功，界面展示不了数据，一直会报java Cannot read property 'length' of undefined错误。列表接口参数转换如图所示：
可以使用postman或者swagger-ui测试一下接口返回数据是否正常。

4．Index.html文件内容，首先引入easyui文件，body标签里面新增表格代码，调用上图的列表接口，url为requestMapping请求路径，如图：

在页面上直接访问localhost:8080/index.html页面，就可以看到列表页面，如下图所示:

注意，如果访问看不到列表页面，打开F12再请求一次，看请求资源是否报错，如果资源报404，就是html文件中引入的easyui文件路径不对，如果全部正常，接口也返回了数据，列表就是展示不了数据，请看第三条，看你的接口返回参数是否跟easyui是否一致，否则需要封装接口的返回参数为easyui需要的格式，这样就可以正常展示。

SpringBoot集成EasyUI相关推荐

Windows下安装Mongodb SpringBoot集成MongoDB和Redis多数据源
全文内容: Mongodb安装说明:Mongodb和redis是开发中常用的中间件,Redis的安装使用比较简单就不写了,只说本地也就是Windows安装Mongodb. SpringBoot集成M ...
SpringBoot集成FreeMarker
给大家简单介绍一下springboot 集成FreeMarker 过程很简单,5分钟即可. 首先在项目中增添依赖spring-boot-starter-freemarker pom文件代码如下: &l ...
springboot集成swagger2测试接口
springboot集成swagger2测试接口 1.需要的依赖 2.开始编写一个swagger2 3.演示效果图片 1.需要的依赖 <dependency><groupId> ...
springboot 集成logback
springboot 集成logback 1.application.properties配置文件指定logback.xml logging.config=classpath:logback.xml ...
springboot集成swagger2多模块中文配置详细步骤，解决集成mybatis或mybatis-plus无法正常使用问题
springboot集成swagger2多模块中文配置详细步骤,解决集成mybatis或mybatis-plus无法正常使用问题参考文章: (1)springboot集成swagger2多模块中文配 ...
SpringBoot集成Quartz(解决@Autowired空指针Null问题即依赖注入的属性为null)
SpringBoot集成Quartz(解决@Autowired空指针Null问题即依赖注入的属性为null) 参考文章: (1)SpringBoot集成Quartz(解决@Autowired空指针Nu ...
SpringBoot集成全局异常处理
2019独角兽企业重金招聘Python工程师标准>>> SpringBoot集成全局异常处理前言对于通常的MVC项目,大量的异常需要我们去处理,如此一来,我们的 Controll ...
dubbo web工程示例_dubbo实战之二：与SpringBoot集成
欢迎访问我的GitHub https://github.com/zq2599/blog_demos 内容:所有原创文章分类和汇总,及配套源码,涉及Java.Docker.Kubernetes.DevO ...
php 配置文件加密工具类,SpringBoot集成Jasypt安全框架以及配置文件内容加密（代码示例）...
本篇文章给大家带来的内容是关于SpringBoot集成Jasypt安全框架以及配置文件内容加密(代码示例),有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助. 我们在SpringBoot项 ...
13.9 SpringBoot集成Swagger2中遇到的问题
13.9 SpringBoot集成Swagger2中遇到的问题我们在使用SpringBoot集成Swagger2中,访问:http://127.0.0.1:8188/swagger-ui.html ...

SpringBoot集成EasyUI

SpringBoot集成EasyUI相关推荐

最新文章

热门文章