欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

Layui 后台加载菜单栏名称以及url的例子

程序员文章站 2024-02-09 12:30:46
一个小小的demo,演示从controller层传参到视图,有使用到springmvc、jstl标签 效果图: 1、testdemo.jsp <%@...

一个小小的demo,演示从controller层传参到视图,有使用到springmvc、jstl标签

效果图:

Layui 后台加载菜单栏名称以及url的例子

1、testdemo.jsp

<%@ page language="java" import="java.util.*"
 contenttype="text/html; charset=utf-8" pageencoding="utf-8"
 iselignored="false"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!doctype html public "-//w3c//dtd html 4.01 transitional//en" "http://www.w3.org/tr/html4/loose.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>insert title here</title>
<meta name="renderer" content="webkit">
<meta http-equiv="x-ua-compatible" content="ie=edge,chrome=1">
<meta name="viewport"
 content="width=device-width, initial-scale=1, maximum-scale=1">
 <!-- 注意:如果你直接复制所有代码到本地,上述css路径需要改成你本地的 -->
<link rel="stylesheet" href="${ pagecontext.request.contextpath }/layui/css/layui.css" rel="external nofollow" media="all">
</head>
<body>
 <ul class="layui-nav layui-nav-tree" lay-filter="test">
 <!-- 侧边导航: <ul class="layui-nav layui-nav-tree layui-nav-side"> -->
 <li class="layui-nav-item layui-nav-itemed"><a href="javascript:;" rel="external nofollow" rel="external nofollow" rel="external nofollow" >默认展开</a>
 <dl class="layui-nav-child">
 <c:foreach var="v" items="${itemname1[0]}" varstatus="i">
  <dd>
  <a href="${pagecontext.request.contextpath}${itemname1[1].get(i.count-1)}" rel="external nofollow" rel="external nofollow" >${itemname1[0].get(i.count-1)}</a>
  </dd>
 </c:foreach>
 </dl></li>
 <li class="layui-nav-item"><a href="javascript:;" rel="external nofollow" rel="external nofollow" rel="external nofollow" >解决方案</a>
 <dl class="layui-nav-child">
 <dd>
  <a href="javascript:;" rel="external nofollow" rel="external nofollow" rel="external nofollow" >后台模版</a>
  <dl class="layui-nav-child">
  <c:foreach var="s" items="${itemname2[0]}" varstatus="i">
  <dd>
  <a href="${pagecontext.request.contextpath}${itemname2[1].get(i.count-1)}" rel="external nofollow" >${itemname2[0].get(i.count-1)}</a>
  </dd>
  </c:foreach>
  </dl>
 </dd>
 <dd>
  <c:foreach var="v" items="${itemname1[0]}" varstatus="i">
  <dd>
  <a href="${pagecontext.request.contextpath}${itemname1[1].get(i.count-1)}" rel="external nofollow" rel="external nofollow" >${itemname1[0].get(i.count-1)}</a>
  </dd>
 </c:foreach>
 </dd>
 </dl></li>
 <li class="layui-nav-item"><a href="">产品</a></li>
 <li class="layui-nav-item"><a href="">大数据</a></li>
 </ul>
<!-- 注意:如果你直接复制所有代码到本地,上述js路径需要改成你本地的 -->
 <script src="layui/layui.js"></script>
 <script>
 layui.use('element', function() {
 var element = layui.element; //导航的hover效果、二级菜单等功能,需要依赖element模块 
 //监听导航点击
 element.on('nav(demo)', function(elem) {
 layer.msg(elem.text());
 });
 });
 </script>
</body>
</html>

2、testcontroller.java

@controller
@scope(value = "prototype")
@requestmapping("/")
public class testcontroller {
 @requestmapping(value="/testdemo") //从上一个页面跳转过来,如果只是看看效果直接输入http://localhost:8080/项目名/testdemo
 public string test(model model)
 {
 list<list<string>>list1=new arraylist();
 list<string> l1 = arrays.aslist("二级菜单1","二级菜单2","二级菜单3");//模拟获得数据
 list<string> l2 = arrays.aslist("/url1","/url2","/url3");
 list<list<string>>list2=new arraylist();
 list<string> l3 = arrays.aslist("三级菜单1","三级菜单2","三级菜单3","三级菜单4");//模拟获得数据
 list<string> l4 = arrays.aslist("/url1","/url2","/url3","/url4");
 list1.add(l1);
 list1.add(l2);
 list2.add(l3);
 list2.add(l4);
 model.addattribute("itemname1",list1);
 model.addattribute("itemname2",list2);
 return"testdemo";
 }
}

以上这篇layui 后台加载菜单栏名称以及url的例子就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持。