一.案例 获取员工数据,返回统一响应结果,在页面上渲染展示
二.展示最终效果
三.步骤
步骤一:
<dependency><groupId>org.dom4j</groupId><artifactId>dom4j</artifactId><version>2.1.3</version>
</dependency>
步骤二:
工具类XMLParserUtils.java
java">package com.gjw.utils;import org.dom4j.Document;
import org.dom4j.Element;
import org.dom4j.io.SAXReader;
import java.io.File;
import java.lang.reflect.Constructor;
import java.util.ArrayList;
import java.util.List;public class XmlParserUtils {public static <T> List<T> parse(String file , Class<T> targetClass) {ArrayList<T> list = new ArrayList<T>(); //封装解析出来的数据try {//1.获取一个解析器对象SAXReader saxReader = new SAXReader();//2.利用解析器把xml文件加载到内存中,并返回一个文档对象Document document = saxReader.read(new File(file));//3.获取到根标签Element rootElement = document.getRootElement();//4.通过根标签来获取 user 标签List<Element> elements = rootElement.elements("emp");//5.遍历集合,得到每一个 user 标签for (Element element : elements) {//获取 name 属性String name = element.element("name").getText();//获取 age 属性String age = element.element("age").getText();//获取 image 属性String image = element.element("image").getText();//获取 gender 属性String gender = element.element("gender").getText();//获取 job 属性String job = element.element("job").getText();//组装数据Constructor<T> constructor = targetClass.getDeclaredConstructor(String.class, Integer.class, String.class, String.class, String.class);constructor.setAccessible(true);T object = constructor.newInstance(name, Integer.parseInt(age), image, gender, job);list.add(object);}} catch (Exception e) {e.printStackTrace();}return list;}}
java">package com.gjw.pojo;public class Emp {private String name;private Integer age;private String image;private String gender;private String job;public Emp() {}public Emp(String name, Integer age, String image, String gender, String job) {this.name = name;this.age = age;this.image = image;this.gender = gender;this.job = job;}public String getName() {return name;}public void setName(String name) {this.name = name;}public Integer getAge() {return age;}public void setAge(Integer age) {this.age = age;}public String getImage() {return image;}public void setImage(String image) {this.image = image;}public String getGender() {return gender;}public void setGender(String gender) {this.gender = gender;}public String getJob() {return job;}public void setJob(String job) {this.job = job;}@Overridepublic String toString() {return "Emp{" +"name='" + name + '\'' +", age=" + age +", image='" + image + '\'' +", gender='" + gender + '\'' +", job='" + job + '\'' +'}';}
}
XML文件emp.xml
<?xml version="1.0" encoding="UTF-8" ?>
<emps><emp><name>金毛狮王</name><age>55</age><image>https://web-framework.oss-cn-hangzhou.aliyuncs.com/web/1.jpg</image><!-- 1: 男, 2: 女 --><gender>1</gender><!-- 1: 讲师, 2: 班主任 , 3: 就业指导 --><job>1</job></emp><emp><name>白眉鹰王</name><age>65</age><image>https://web-framework.oss-cn-hangzhou.aliyuncs.com/web/2.jpg</image><gender>1</gender><job>1</job></emp><emp><name>青翼蝠王</name><age>45</age><image>https://web-framework.oss-cn-hangzhou.aliyuncs.com/web/3.jpg</image><gender>1</gender><job>2</job></emp><emp><name>紫衫龙王</name><age>38</age><image>https://web-framework.oss-cn-hangzhou.aliyuncs.com/web/4.jpg</image><gender>2</gender><job>3</job></emp>
</emps>
步骤三:省略
步骤四:编写Controller程序
java">package com.gjw.controller;
/*对xml文件进行处理,从而加载处理要响应的数据*/
import com.gjw.pojo.Emp;
import com.gjw.pojo.Result;
import com.gjw.service.EmpService;
import com.gjw.service.impl.EmpServiceA;
import com.gjw.utils.XmlParserUtils;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;
import java.util.List;@RestController
public class EmpController {@RequestMapping("/listEmp")public Result list(){// 1.加载emp.xml,并解析emp.xml中的数据String file = this.getClass().getClassLoader().getResource("emp.xml").getFile();System.out.println(file);List<Emp> empList = XmlParserUtils.parse(file, Emp.class);// 2.对员工信息中的gender,job字段进行处理empList.stream().forEach(emp ->{if ("1".equals(emp.getGender())) {emp.setGender("男");} else if ("2".equals(emp.getGender())) {emp.setGender("女");}if ("1".equals(emp.getJob())) {emp.setJob("讲师");} else if ("2".equals(emp.getJob())) {emp.setJob("班主任");} else if ("3".equals(emp.getJob())) {emp.setJob("就业指导");}});// 3.组装数据并返回return Result.success(empList);}
}
Controller程序详解:
1.加载emp.xml,并解析emp.xml中的数据
将解析到的emp.xml中的数据以Emp员工类的对象形式存储在empList集合当中。
2.对员工信息中的gender,job字段进行处理
gender是1,对应男。2,对应女。job是1,对应讲师。2,对应班主任。3,对应就业指导。
3.组装数据并返回
最后将empList中的数据通过类方法success(详见请求响应-07.响应-@ResponseBody&统一响应结果-CSDN博客)传入empList参数返回。前端会将返回回去的结果作为响应数据渲染展示。
emp.html
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>员工信息</title>
</head><link rel="stylesheet" href="element-ui/index.css">
<script src="./js/vue.js"></script>
<script src="./element-ui/index.js"></script>
<script src="./js/axios-0.18.0.js"></script><body><h1 align="center">员工信息列表展示</h1><div id="app"><el-table :data="tableData" style="width: 100%" stripe border ><el-table-column prop="name" label="姓名" align="center" min-width="20%"></el-table-column><el-table-column prop="age" label="年龄" align="center" min-width="20%"></el-table-column><el-table-column label="图像" align="center" min-width="20%"><template slot-scope="scope"><el-image :src="scope.row.image" style="width: 80px; height: 50px;"></el-image></template></el-table-column><el-table-column prop="gender" label="性别" align="center" min-width="20%"></el-table-column><el-table-column prop="job" label="职位" align="center" min-width="20%"></el-table-column></el-table></div>
</body><style>.el-table .warning-row {background: oldlace;}.el-table .success-row {background: #f0f9eb;}
</style><script>new Vue({el: "#app",data() {return {tableData: []}},mounted(){axios.get('/listEmp').then(res=>{if(res.data.code){this.tableData = res.data.data;}});},methods: {}});
</script>
</html>
在钩子方法中通过'/listEmp'路径进行前端页面的展示,如果状态码为1,那么则证明前端获取到了正确的数据,data中的data属性展示出来即可。