Springboot入门笔记10

想法是：点击员工管理 跳到员工查询页面

但目前 点击Customers超链接后会跳到bootstrap的模板网站 所以需要自定义 href

在 dashboard找到 Customers 并将其改为 ：员工管理

把list.html放入员工文件夹下（对功能页进行分类）



EmployeeController.java

package com.hiss.springboot03web.controller;

import com.hiss.springboot03web.dao.EmployeeDao;
import com.hiss.springboot03web.pojo.Employee;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;

import java.util.Collection;

@Controller
public class EmployeeController {
    @Autowired
    EmployeeDao employeeDao;

    @RequestMapping("/emps")
    public String list(Model model){
        Collection employees = employeeDao.getAll();
        model.addAttribute("emps",employees);
        return "emp/list";
    }
}

同dashboard一样 将list也进行修改

点击员工管理 效果如下：

可以发现 无论首页还是员工管理 侧边栏和头部导航栏这些公共部分是相同的 可以利用Fragment抽取出来 实现代码复用

以下只是演示抽取侧边栏和头部导航栏，现在不用做，后面会有整合
1.抽出侧边栏的公共部分 它就变成了一个组件

2.想把组件插到 list 的侧边栏里 删掉原有的

3.Fragment格式：

所以此处更改为：

4.同理将头部也抽出来

5.把list中原有的顶部导航栏删除

6.更改为：

可以看到 员工管理页也会有侧边栏和头部导航栏 抽取并插入成功：

整合（提取公共页面）：
1.新建commons存放组件

2.将这两部分剪切粘贴到commons

3.修改部分内容

4.给dashboard加这个组件

5.list同理

效果如下：

实现侧边栏标签高亮效果
1.给组件传递参数


2.接收调用sidebar时传递的参数

效果如下：实现了选择高亮

list页面展示所有员工数据

tbody里的内容修改为：（列表循环展示）

效果如下：

                                                                         参考资料：狂神说