项目简述:一个小Demo,这是一个实现了数据的增删改查和分页功能的页面
所用技术:
前端——Vue+Element+JQuery
后端——SpringBoot+Springdata jpa
项目流程:
1、创建项目
选择Spring Initializr,确定项目的名称、位置、依赖、域名、SDK等属性
注意:初学者SDK和JDK不要选择太高了,避免出现一些不必要的BUG或者未了解新的特性

点击Next,可以设置Spring Boot版本,同理不要设置的太高了。
同时,在此页面可以导入依赖,本次项目只需要导入三个包:Spring Web——spring框架的核心类;Spring Data JPA——整合数据库操作;MYSQL Driver——数据库驱动

2、导入自己的本地依赖

导入完成就OK了
3、构建工程结构
SpringBoot 项目一般外层只有两个文件,pom.xml文件 和src文件夹。
pom.xml文件的内容是Spring的一些依赖配置
src文件夹的内容包括项目的大致结构,点开src文件夹里面包含main文件夹,点开main文件夹是java和resource文件夹。其中java里保存的spring后台的框架,resource中有static文件夹是存放静态页面的地方,application.yml用于连接数据库。

简单介绍下spring框架各个部件的功能:
SpringCrudApplication:它是Spingboot的一个启动类
common:它是一个通用配置文件夹里面包含Result(一个返回json数据的包装类)和WebMvcConfig(用于配置跨域访问)
controller:控制层,控制业务逻辑
service:业务层,控制业务
dao:持久层,主要用于数据库交互
entity:实体层,数组库在项目中的类
4、创建数据库
创建一个数据库表

给表中添加一些数据

5、实现CRUD功能
框架和数据库表都搭建好了之后,接下来就可以开始实现后台的增删改查了。
(1)首先实现一个与我们创建的表对应的entity实体类。注意,实体类中的每一个字段都要与数据库表的字段对应

设置实体类中的属性,让属性与数据库中的表属性一一对应,并且实现每一个属性的getter和setter方法。
(2)配置dao接口,完成与数据库的交互

本文详细介绍了如何使用Vue.js前端框架和SpringBoot后端框架,结合Element UI和JQuery,实现数据的增删改查和分页功能。从创建项目、配置依赖、构建工程结构,到数据库操作和接口实现,再到前端页面的展示,一步步展示了整个开发过程。最后,页面实现了与数据库的实时交互,具备完整的CRUD操作和分页查询功能。
最低0.47元/天 解锁文章
1286





