树形菜单实现(SSM)

最新推荐文章于 2021-05-19 11:38:54 发布

幸福天涯

最新推荐文章于 2021-05-19 11:38:54 发布

阅读量1.1k

点赞数

分类专栏： Spring SpringMVC 文章标签： SSM AJAX

本文链接：https://blog.csdn.net/weixin_43708793/article/details/106396195

版权

Spring 同时被 2 个专栏收录

10 篇文章 0 订阅

订阅专栏

SpringMVC

2 篇文章 0 订阅

订阅专栏

1、搭建SSM(Spring+Spring MVC+Mybatis)所用包：
在这里插入图片描述
2、web.xml配置+Spring配置文件+SpringMVC配置文件
2.1、web.xml配置文件

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee"
         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_4_0.xsd"
         version="4.0">
    <!--Spring上下文配置文件-->
    <context-param>
        <param-name>contextConfigLocation</param-name>
        <param-value>classpath:applicationContext.xml</param-value>
    </context-param>
    <!--监听配置-->
    <listener>
        <listener-class>org.springframework.web.context.ContextLoaderListener</listener-class>
    </listener>

    <!--前端控制器-->
    <servlet>
        <servlet-name>dispatcherServlet</servlet-name>
        <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
        <init-param>
            <param-name>contextConfigLocation</param-name>
            <param-value>classpath:springMVC.xml</param-value>
        </init-param>
        <load-on-startup>1</load-on-startup>
    </servlet>
    <servlet-mapping>
        <servlet-name>dispatcherServlet</servlet-name>
        <url-pattern>/</url-pattern>
    </servlet-mapping>
    <!--字符串编码过滤-->
    <filter>
        <filter-name>encod</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>
    </filter>
    <filter-mapping>
        <filter-name>encod</filter-name>
        <url-pattern>/*</url-pattern>
    </filter-mapping>
</web-app>

2.2、Spring配置文件–applicationContext.xml
主要配置注解扫描、数据库连接配置、sqlSessionFactory、映射配置、事务管理等，映射配置中一般会配置持久层(Dao)接口扫描,这样扫描后的接口由spring容器管理，可以用于自动注入（会生成对应的动态代理类）；sqlSessionFactory配置中除了引入数据库数据库连接信息对象外，一般还会配置model(pojo)封装类的别名配置，用于给model封装类起别名。

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
       xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
       xmlns:context="http://www.springframework.org/schema/context"
       xmlns:tx="http://www.springframework.org/schema/tx"
       xmlns:aop="http://www.springframework.org/schema/aop"

       xsi:schemaLocation="
    http://www.springframework.org/schema/aop http://www.springframework.org/schema/aop/spring-aop-4.0.xsd
    http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans.xsd
        http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context-4.0.xsd
        http://www.springframework.org/schema/tx
        http://www.springframework.org/schema/tx/spring-tx.xsd" default-autowire="byName">
    <!--注解扫描:Spring注解扫描一般是扫描业务逻辑层(Service)-->
    <context:component-scan base-package="Menu.Service.impl"></context:component-scan>

    <!--读取属性文件-->
    <context:property-placeholder location="classpath:dataBase.properties"></context:property-placeholder>

    <!--数据库配置-->
    <bean id="dataSource" class="org.springframework.jdbc.datasource.DriverManagerDataSource">
        <property name="driverClassName" value="${db.driver}"></property>
        <property name="url" value="${db.url}"></property>
        <property name="username" value="${db.user}"></property>
        <property name="password" value="${db.password}"></property>
    </bean>

    <!--SqlSessionFactory-->
    <bean id="factory" class="org.mybatis.spring.SqlSessionFactoryBean">
        <!--默认使用名称自动注入-->
       <property name="dataSource" ref="dataSource"></property>

        <!--别名配置-->
        <property name="typeAliasesPackage" value="Model"></property>
    </bean>

    <!--映射配置-->
    <bean class="org.mybatis.spring.mapper.MapperScannerConfigurer">
        <property name="basePackage" value="Menu.Dao"></property>
        <property name="sqlSessionFactoryBeanName" value="factory"></property>
    </bean>

    <!--事务管理器-->
    <bean id="txManager" class="org.springframework.jdbc.datasource.DataSourceTransactionManager">
        <!--默认全局使用byName自动注入-->
        <property name="dataSource" ref="dataSource"></property>
    </bean>
    <tx:advice transaction-manager="txManager" id="tansaction">
        <tx:attributes>
            <tx:method name="ins*"/>
            <tx:method name="del*"/>
            <tx:method name="upd*"/>
            <tx:method name="*" read-only="true"/>
        </tx:attributes>
    </tx:advice>

    <aop:config>
        <aop:pointcut id="myPoint" expression="execution(* Menu.Service.impl.*.*(..))"></aop:pointcut>
        <aop:advisor pointcut-ref="myPoint" advice-ref="tansaction"></aop:advisor>
    </aop:config>
</beans>

2.3、dataBase.properties文件
数据库连接信息

db.driver=com.mysql.jdbc.Driver
db.url=jdbc:mysql://localhost:3306/mybatis
db.user=root
db.password=root

2.4、Spring MVC配置文件
注解扫描，主要配置Controller相关包，及必须的mvc的注解驱动(主要替代请求解析及匹配请求具体执行的方法)，一般会配置不需要拦截的(放行)静态资源、视图解析配置。

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
       xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
       xmlns:mvc="http://www.springframework.org/schema/mvc"
       xmlns:context="http://www.springframework.org/schema/context"
       xsi:schemaLocation="http://www.springframework.org/schema/beans 
           http://www.springframework.org/schema/beans/spring-beans.xsd 
           http://www.springframework.org/schema/context 
           http://www.springframework.org/schema/context/spring-context.xsd 
           http://www.springframework.org/schema/mvc 
           http://www.springframework.org/schema/mvc/spring-mvc.xsd">
    <!--注解扫描-->
    <context:component-scan base-package="Controller.webController"></context:component-scan>
    <!--注解驱动-->
    <mvc:annotation-driven></mvc:annotation-driven>
    <!--静态资源-->
    <mvc:resources mapping="/js/**" location="/js/"></mvc:resources>
    <mvc:resources mapping="/images/**" location="/images/"></mvc:resources>
    <!--视图解析器-->
    <bean class="org.springframework.web.servlet.view.InternalResourceViewResolver">
        <property name="suffix" value="/"></property>
        <property name="prefix" value=".jsp"></property>
    </bean>
</beans>

3、持久层(Dao)接口+Mapper映射文件
3.1、MenuDao.java
保证Dao层包路径及接口名与mapper文件的路径及文件名一致。
在这里插入图片描述

package Menu.Dao;

import Model.MenuModel;

import java.util.List;

public interface MenuDao {
    /**
     * 查询所有的菜单信息
     */
    List<MenuModel> queryMenuByParentId(int pid);
}

3.2、MenuDao.xml

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapper
        PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
        "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="Menu.Dao.MenuDao">
    <resultMap id="myMenu" type="menuModel">
        <id column="id" property="id"></id>
        <collection property="childs" select="Menu.Dao.MenuDao.queryMenuByParentId" column="id"></collection>
    </resultMap>
    <select id="queryMenuByParentId" parameterType="int" resultMap="myMenu">
      select * from menu where parentid = #{pid}
    </select>
</mapper>

4、逻辑层代码(Service)
4.1、接口

package Menu.Service;


import Model.MenuModel;

import java.util.List;

public interface MenuService {
    List<MenuModel> show();
}

4.2、实现类
使用注解@Service、@Resource前提是在spring配置文件中配置实现类所在包的注解扫描，@Service与@Controller<bean>功能一致，主要用于创建对象，并使用spring容器管理；
@Resource是默认方式为byName的自动注入，此注解是JDK中的注解，spring中也有自动注入的注解@Autowire,默认以byType自动注入。

package Menu.Service.impl;

import Menu.Dao.MenuDao;
import Menu.Service.MenuService;
import Model.MenuModel;
import org.springframework.stereotype.Service;

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

@Service
public class MenuServiceImpl implements MenuService {

    @Resource  //此注解是JDK中的提供的自动注入注解，默认使用byName
    private MenuDao menuDao;

    @Override
    public List<MenuModel> show() {
        return menuDao.queryMenuByParentId(0);
    }
}

5、Model（pojo）封装类
5.1、MenuModel.java

封装类中添加了集合属性List<MenuModel>,此属性主要用于mybatis中的一对多，体现了菜单的上下级关系。
package Model;

import java.util.List;

public class MenuModel {
    private int id;
    private String name;
    private int parentId;
    private List<MenuModel> childs;

    public int getId() {
        return id;
    }

    public void setId(int id) {
        this.id = id;
    }

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public int getParentId() {
        return parentId;
    }

    public void setParentId(int parentId) {
        this.parentId = parentId;
    }

    public List<MenuModel> getChilds() {
        return childs;
    }

    public void setChilds(List<MenuModel> childs) {
        this.childs = childs;
    }
}

5.2、表结构
在这里插入图片描述

6、控制器–controller
注解@Controller实例化控制器类，使用Spring MVC容器管理；@Resource默认以byName方式进行自动注入；@RequestMapping("")，请求地址映射，匹配前端请求；@ResponseBody是将方法放回的对象数据集通过适当的转换器转换为适当的格式，将转换之后的数据写入到Response的body区域，一般转换格式为JSON或者xml(需要json相关jar包)。

package Controller.webController;

import Menu.Service.MenuService;
import Model.MenuModel;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;

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

@Controller
public class MenuController {
    /**
     * 使用实现类在spring容器中的
     */
    @Resource
    private MenuService menuServiceImpl;

    @RequestMapping("show")
    @ResponseBody
    public List<MenuModel> show(){
        System.out.println("ceshi  : "+menuServiceImpl.show());
        return menuServiceImpl.show();
    }
}


**7、前端代码：**
前端请求使用ajax,将

请求地址，请求方式、返回值方式、请求成功/失败等情况使用ajax处理，并在页面展示。

index.jsp：

<%@page language="java" pageEncoding="UTF-8" contentType="text/html; utf-8" %>

<html>
<head>
    <script type="text/javascript" src="/js/jquery-1.7.2.js"></script>
    <script type="text/javascript">
        $(function(){
            $.ajax({
                type:"post",
                url:"show",
                //data:"{"":"",...}",
                success:function(data){
                    var html = "";
                    for(var i=0;i<data.length;i++){
                        html += "<dl>";
                        html +="<dt style='cursor:pointer'>"+data[i].name+"</dt>";
                        if(data[i].childs.length>0){
                            var child = data[i].childs;
                            console.log(child);
                            for(var j=0;j<child.length;j++){
                                console.log("child : ---> "+child[j]);
                                html+="<dd>"+child[j].name+"</dd>";
                            }
                        }
                        html+="</dl>";
                    }

                    $("body").html(html);
                },
                error:function(){

                },
                dataType:"json"
            });

            //使用$().live("事件",function(){})，在此 事件委派(.live)之后追加的元素也会起作用
            $("dt").live("click",function(){
                /**
                 * .siblings() : 取得一个包含匹配的元素集合中每一个元素的所有唯一同辈元素的元素集合。可以用可选的表达式进行筛选。
                 * .toggle("swing")/slideToggle(1000):如果隐藏，操作后展开，如果是展开，则操作后是隐藏，括号中的值是展开/隐藏的模式/时间
                 */
                $(this).siblings().toggle("swing");
                //$(this).siblings().slideToggle(1000);
            })
        })
    </script>
</head>
<body>
<h2>属性菜单(原生)</h2>
<hr>
<br>
<%--<form method="post" action="show">
    <input value="查看菜单信息" type="submit">
</form>--%>

</body>
</html>

幸福天涯

关注

0
点赞
踩
5

收藏

觉得还不错? 一键收藏
1
评论
树形菜单实现(SSM)

1、搭建SSM(Spring+Spring MVC+Mybatis)所用包：2、web.xml配置+Spring配置文件+SpringMVC配置文件2.1、web.xml配置文件<?xml version="1.0" encoding="UTF-8"?><web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
复制链接

扫一扫