VueSSM搭建⼀个简单的Demo前后端分离含增删改查（CRUD）、分页、批量功能
前⾔
最近想复习⼀下SSM，所以就搭建了这个⼩DEMO，轻车熟路，个⼈认为在只⽤到SSM框架的前提下，这样做是最简洁的搭建⽅式了。写这篇博客也是复习的⼀部分，也想收获些意料之外的XXXX。
⽤到的技术和开发⼯具
前端
开发⼯具：WebStorm
开发框架：vue + axios + elementUI
包管理⼯具: npm
打包⼯具：webpack
后端
开发⼯具：IDEA
开发框架：springMVC + spring + mybatis
打包⼯具：maven
数据库： MySQL
需求及功能
增删改查（CRUD）
分页
批量删除
前后端分离
后台开发环境搭建
File->New->Project…->maven->.......百度
后台代码
ssm_project/src/main/l
<?xml version="1.0" encoding="UTF-8"?>
<beans
xmlns="/schema/beans"
xmlns:xsi="/2001/XMLSchema-instance"
xmlns:context="/schema/context"
xmlns:aop="/schema/aop"
xmlns:tx="/schema/tx"
xmlns:p="/schema/p"
xsi:schemaLocation="/schema/beans /schema/beans/spring-beans-3.0.xsd
/schema/context
/schema/context/spring-context-4.3.xsd
/schema/aop
/schema/aop/spring-aop-4.3.xsd
/schema/tx
/schema/tx/spring-tx-4.3.xsd">
<!-- @Component, @Repository, @Service, @Controller, @Autowired, @Resources -->
<!-- ⽤注解进⾏开发 -->
<context:annotation-config></context:annotation-config>
<!-- 注解扫描包 -->
<context:component-scan base-package="ample">
<!-- 这⾥不加载Controller的bean -->
<context:exclude-filter type="annotation" expression="org.springframework.stereotype.Controller"/>
</context:component-scan>
<!-- 1. 数据源 -->
<!-- 读取db.properties⽂件. 读取到数据库信息 -->
<context:property-placeholder location="classpath:db.properties"/>
<bean id="dataSource" class="com.alibaba.druid.pool.DruidDataSource">
<property name="driverClassName" value="${jdbc.driver}"></property>
<property name="url" value="${jdbc.url}"></property>
<property name="username" value="${jdbc.username}"></property>
<property name="password" value="${jdbc.password}"></property>
</bean>
<!-- 2. 创建sqlSessionFactory ==> mybatis核⼼配置⽂件的读取 -->
<bean id="sqlSessionFactory" class="batis.spring.SqlSessionFactoryBean">
<property name="dataSource" ref="dataSource"></property>
<property name="configLocation" value="l"></property>
<property name="mapperLocations" value="classpath:mapper/*.xml"/>
</bean>
<!-- 3.扫描mybatis的mapper接⼝路径 -->
<!-- 这个bean可以把我们的mapper接⼝直接扫描到. 直接把接⼝扫描完. 注册到spring的bean中 -->
<bean class="batis.spring.mapper.MapperScannerConfigurer">
<property name="sqlSessionFactoryBeanName" value="sqlSessionFactory"></property>
<!-- 会在提供的base包下寻interface .根据interface的名字. 将⾸字母⼩写⽣成这个接⼝所对应的bean -->
<property name="basePackage" value="ample.mapper"></property>
</bean>
<!-- 4.事务处理 -->
<bean id="transactionManager" class="org.springframework.jdbc.datasource.DataSourceTransactionManager">
<property name="dataSource" ref="dataSource"></property>
</bean>
<tx:advice id="txManager" transaction-manager="transactionManager">
<tx:attributes>
<tx:method name="get*" read-only="true"/>
<tx:method name="query*" read-only="true"/>
<tx:method name="search*" read-only="true"/>
<tx:method name="select*" read-only="true"/>
<tx:method name="find*" read-only="true"/>
<tx:method name="*" isolation="DEFAULT" propagation="REQUIRED"/>
</tx:attributes>
</tx:advice>
<aop:config>
<aop:pointcut expression="execution(* ample.service.*.*.*(..))" id="cut"/>
<aop:advisor advice-ref="txManager" pointcut-ref="cut"/>
</aop:config>
<!-- ⽤注解处理事务
<tx:annotation-driven transaction-manager="transactionManager"/>
-
->
</beans>
ssm_project/src/main/l
<?xml version="1.0" encoding="UTF-8"?>
<beans
xmlns="/schema/beans"
xmlns:xsi="/2001/XMLSchema-instance"
xmlns:mvc="/schema/mvc"
xmlns:context="/schema/context"
xmlns:p="/schema/p"
xsi:schemaLocation="/schema/beans
/schema/beans/spring-beans-4.3.xsd
/schema/mvc
/schema/mvc/spring-mvc-4.3.xsd
/schema/context
/schema/context/spring-context-4.3.xsd">
<!-- 开启注解. 扫描 -->
<context:annotation-config></context:annotation-config>
<context:component-scan base-package="ller"></context:component-scan>
<!-- 过滤掉js, jpg, png, css, 静态⽂件 -->
<mvc:default-servlet-handler/>
<!-- 开启mvc -->
<mvc:annotation-driven />
<!-- 地址解析器 -->
<bean class="org.springframework.web.servlet.view.InternalResourceViewResolver">
<property name="prefix" value="/WEB-INF/views/"></property>
<property name="suffix" value=".jsp"></property>
</bean>
</beans>
ssm_project/src/main/l
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE configuration
PUBLIC "-////DTD Config 3.0//EN"
"/dtd/mybatis-3-config.dtd">
<configuration><!-- mybatis的核⼼配置 -->
<!-- mybatis的运⾏配置 -->
<settings>
<!-- 开启⼆级缓存 -->
<setting name="cacheEnabled" value="true"/>
<setting name="lazyLoadingEnabled" value="true"/>
<!-- 打印查询语句 -->
<setting name="logImpl" value="STDOUT_LOGGING"/>
<!-- 如果这个属性是true，那么你的类中, 任何⼀个⽅法被执⾏.都要去加载属性,
这个时候懒加载是没有效果的.
-
->
<setting name="aggressiveLazyLoading" value="false"/>
</settings>
</configuration>
ssm_project/src/main/resources/db.properties
jdbc.sql.jdbc.Driver
jdbc.url=jdbc:mysql://localhost:3306/ssm_example?useUnicode=true&characterEncoding=utf8&allowMultiQueries=true jdbc.username=root
jdbc.password=123
ssm_project/src/main/resources/log4j.properties
# Global logging configuration
#
log4j.appender.Console=org.apache.log4j.ConsoleAppender
log4j.appender.Console.layout=org.apache.log4j.PatternLayout
log4j.appender.Console.layout.ConversionPattern=%d [%t] %-5p [%c] - %m%n
apache=INFO
ssm_project/src/main/webapp/l
<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.5"
xmlns="java.sun/xml/ns/javaee"
xmlns:xsi="/2001/XMLSchema-instance"
xsi:schemaLocation="java.sun/xml/ns/javaee
java.sun/xml/ns/javaee/web-app_2_5.xsd">
<!-- 读取除了mvc外的配置⽂件 -->
<context-param>
<param-name>contextConfigLocation</param-name>
<param-value>classpath:/l</param-value>
</context-param>
<!-- 整个web容器的动向由这个进⾏监听. 这个可以监听项⽬的启动. 从⽽直接加载核⼼配置⽂件 -->
<listener>
<listener-class>org.t.ContextLoaderListener</listener-class>
</listener>
<filter>
<filter-name>characterEncodingFilter</filter-name>
<filter-class>org.springframework.web.filter.CharacterEncodingFilter</filter-class>
<init-param>
<param-name>encoding</param-name>
<param-value>UTF-8</param-value>
</init-param>
<init-param>
<param-name>forceEncoding</param-name>
<param-value>true</param-value>
</init-param>
</filter>
<filter-mapping>
<filter-name>characterEncodingFilter</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>
<servlet>
<servlet-name>springMVC</servlet-name>
<servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
<!-- 给出spring的路径 -->
<init-param>
<param-name>contextConfigLocation</param-name>
<param-value>l</param-value>
</init-param>
<load-on-startup>1</load-on-startup><!-- 当web容器加载的时候, 初始化spring -->
</servlet>
<servlet-mapping>
<servlet-name>springMVC</servlet-name>
<url-pattern>/</url-pattern><!-- 所有 -->
</servlet-mapping>
<listener>
<listener-class>org.t.request.RequestContextListener</listener-class>
</listener>
</web-app>
ssm_l
<project xmlns="/POM/4.0.0" xmlns:xsi="/2001/XMLSchema-instance" xsi:schemaLocation="/POM/4.0.0 /xsd/maven-4.0.0.xsd"> <modelVersion>4.0.0</modelVersion>
<groupId&le</groupId>
<artifactId>ssm_project</artifactId>
<version>0.0.1-SNAPSHOT</version>
<packaging>war</packaging>
<dependencies>
<dependency>
<groupId>org.slf4j</groupId>
<artifactId>slf4j-api</artifactId>
<version>1.7.12</version>
</dependency>
<dependency>
<groupId>ch.qos.logback</groupId>
<artifactId>logback-core</artifactId>
<version>1.1.1</version>
<scope>provided</scope>
</dependency>
<!--实现slf4j接⼝并整合-->
<dependency>
<groupId>ch.qos.logback</groupId>
<artifactId>logback-classic</artifactId>
<version>1.1.1</version>
<scope>provided</scope>
</dependency>
<!--druid==>阿⾥巴巴数据库连接池-->
<dependency>
<groupId>com.alibaba</groupId>
<artifactId>druid</artifactId>
<version>1.0.25</version>
</dependency>
<!--2.dao框架:MyBatis依赖-->
<dependency>
<groupId&batis</groupId>
<artifactId>mybatis</artifactId>
<version>3.3.0</version>
</dependency>
<!--mybatis⾃⾝实现的spring整合依赖-->
<dependency>
<groupId&batis</groupId>
<artifactId>mybatis-spring</artifactId>
<version>1.3.2</version>
</dependency>
<!--3.Servlet web相关依赖-->
<dependency>
<groupId>taglibs</groupId>
<artifactId>standard</artifactId>
<version>1.1.2</version>
</dependency>
<dependency>
<groupId>jstl</groupId>
<artifactId>jstl</artifactId>
<version>1.2</version>
</dependency>
<dependency>
<groupId>com.</groupId>
<artifactId>jackson-databind</artifactId>
<version>2.5.4</version>
</dependency>
<dependency>
<groupId>javax.servlet</groupId>
<artifactId>javax.servlet-api</artifactId>
<version>3.1.0</version>
<scope>provided</scope>
</dependency>
<!--4:spring依赖-->
<!--1)spring核⼼依赖-->
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-core</artifactId>
<version>4.3.14.RELEASE</version>
</dependency>
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-beans</artifactId>
<version>4.3.14.RELEASE</version>
</dependency>
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-context</artifactId>
<version>4.3.14.RELEASE</version>
</dependency>
<!--2)spring dao层依赖-->
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-jdbc</artifactId>
<version>4.3.14.RELEASE</version>
</dependency>
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-tx</artifactId>
<version>4.3.14.RELEASE</version>
</dependency>
<!--3)springweb相关依赖-->
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-web</artifactId>
<version>4.3.14.RELEASE</version>
</dependency>
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-webmvc</artifactId>
<version>4.3.14.RELEASE</version>
</dependency>
<!--4)spring test相关依赖-->
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-test</artifactId>
<version>4.3.14.RELEASE</version>
</dependency>
<dependency>
<groupId>mysql</groupId>
<artifactId>mysql-connector-java</artifactId>
<version>5.1.38</version>
<scope>runtime</scope>
</dependency>
<!--Aop要导⼊的包-->
<dependency>
<groupId>org.aspectj</groupId>
<artifactId>aspectjweaver</artifactId>
<version>1.8.9</version>
</dependency>
<!-- mvnrepository/artifact/org.json/json -->
<dependency>
<groupId>org.json</groupId>
<artifactId>json</artifactId>
<version>20170516</version>
</dependency>
</dependencies>
<build>
<plugins>
<plugin>
<groupId>org.apache.maven.plugins</groupId>
<artifactId>maven-compiler-plugin</artifactId>
<configuration>
<source>1.8</source>
<target>1.8</target>
</configuration>
</plugin>
</plugins>
</build>
</project>
ssm_project/src/main/java/com/example/pojo/User.java ample.pojo;
public class User {
private String userId;//⽤户id
private String cardType;//证件类型
private String cardNo;//证件号码
private String userName;//⽤户姓名
private String userSex;//⽤户性别
private String userAge;//⽤户年龄
private String userRole;//⽤户⾓⾊
public String getUserId() {
return userId;
}
public void setUserId(String userId) {
this.userId = userId;
}
public String getCardType() {
return cardType;
}
public void setCardType(String cardType) {
this.cardType = cardType;
}
public String getCardNo() {
return cardNo;
}
public void setCardNo(String cardNo) {
this.cardNo = cardNo;
}
public String getUserName() {
return userName;
}
public void setUserName(String userName) {
this.userName = userName;
}
public String getUserSex() {
return userSex;
}
public void setUserSex(String userSex) {
this.userSex = userSex;
}
public String getUserAge() {
return userAge;
}
public void setUserAge(String userAge) {
this.userAge = userAge;
}
public String getUserRole() {
return userRole;
}
public void setUserRole(String userRole) {
this.userRole = userRole;
}
}
ssm_project/src/main/resources/l
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE mapper PUBLIC "-////DTD Mapper 3.0//EN" "/dtd/mybatis-3-mapper.dtd" > <mapper namespace="ample.mapper.UserMapper" >
<resultMap id="BaseResultMap" type="ample.pojo.User" >
<id property="userId" column="user_id" jdbcType="VARCHAR" /><!--⽤户id-->
<result property="cardType" column="card_type" jdbcType="VARCHAR" /><!--证件类型-->
<result property="cardNo" column="card_no" jdbcType="VARCHAR" /><!--证件号码-->
<result property="userName" column="user_name" jdbcType="VARCHAR" /><!--⽤户姓名-->
<result property="userSex" column="user_sex" jdbcType="VARCHAR" /><!--⽤户性别-->
<result property="userAge" column="user_age" jdbcType="VARCHAR" /><!--⽤户年龄-->
<result property="userRole" column="user_role" jdbcType="VARCHAR" /><!--⽤户⾓⾊-->
</resultMap>
<sql id="Base_Column_List" >
user_id, card_type, card_no, user_name, user_sex, user_age, user_role
ssm框架实现登录功能</sql>
<!--分页查询⽤户-->
<select id="queryUserPage" resultMap="BaseResultMap" parameterType="java.lang.Integer">
select
<include refid="Base_Column_List" />
from user
order by user_id desc
limit #{startRows,jdbcType=INTEGER},5
</select>
<!--分页查询⽤户-->
<select id="selectUserPage" resultMap="BaseResultMap">
select
<include refid="Base_Column_List" />
from user
<where>
<if test="userName != null and userName !=''">
and user_name like concat('%', #{userName}, '%')
</if>
<if test="userSex != null and userSex !=''">
and user_sex = #{userSex}
</if>
</where>
order by user_id desc
limit #{startRows,jdbcType=INTEGER},5
</select>
<!--查询⽤户个数-->
<select id="getRowCount" resultType="java.lang.Integer">
select count(*) from user
<where>
<if test="userName != null and userName !=''">
and user_name like concat('%', #{userName}, '%')
</if>
<if test="userSex != null and userSex !=''">
and user_sex = #{userSex}
</if>
</where>
</select>
<!--添加⽤户信息-->
<insert id="createUser" parameterType="ample.pojo.User" >
insert into User(<include refid="Base_Column_List" />)
values(#{userId}, #{cardType}, #{cardNo}, #{userName}, #{userSex}, #{userAge}, #{userRole})
</insert>
版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。
发表评论