spring学习笔记（二十四）springboot_web开发

最新推荐文章于 2022-05-05 23:22:54 发布

毛依依

最新推荐文章于 2022-05-05 23:22:54 发布

阅读量285

点赞数

分类专栏： spring 文章标签： web开发

本文链接：https://blog.csdn.net/baidu_15873551/article/details/100006718

版权

本文是Spring Boot Web开发的学习笔记，主要涵盖了链接高亮的实现，包括针对选中页面的高亮显示，以及通过遍历获取动态员工数据。此外，还讨论了日期格式化和添加、编辑、删除按钮的功能集成。

摘要由CSDN通过智能技术生成

4.11 链接高亮&列表完成

1.链接高亮

 <a class="nav-link active" href="#" th:href="@{/main.html}">
 <a class="nav-link active" th:href="@{/emps}">

但是上面的方法不能解决某一个选中之后之高亮当前页

2.高亮某一个选中显示的页面

1）、把sideBar和topBar公共部分抽取成一个bar.html

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>bar</title>
</head>
<body>
<!-- topBar -->
<nav class="navbar navbar-dark sticky-top bg-dark flex-md-nowrap p-0" th:fragment="topbar">
    <a class="navbar-brand col-sm-3 col-md-2 mr-0" href="http://getbootstrap.com/docs/4.0/examples/dashboard/#">[[${session.loginUser}]]</a>
    <input class="form-control form-control-dark w-100" type="text" placeholder="Search" aria-label="Search">
    <ul class="navbar-nav px-3">
        <li class="nav-item text-nowrap">
            <a class="nav-link" href="http://getbootstrap.com/docs/4.0/examples/dashboard/#">Sign out</a>
        </li>
    </ul>
</nav>

<!-- sidebar -->
<nav class="col-md-2 d-none d-md-block bg-light sidebar" id="sideBar">
    <div class="sidebar-sticky">
        <ul class="nav flex-column">
            <li class="nav-item">
                <a class="nav-link active"
                   href="#" th:href="@{/main.html}">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-home">
                        <path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path>
                        <polyline points="9 22 9 12 15 12 15 22"></polyline>
                    </svg>
                    Dashboard <span class="sr-only">(current)</span>
                </a>
            </li>
            <li class="nav-item">
                <a class="nav-link" href="http://getbootstrap.com/docs/4.0/examples/dashboard/#">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-file">
                        <path d="M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z