Web第四次作业

最新推荐文章于 2024-07-23 14:51:29 发布
最新推荐文章于 2024-07-23 14:51:29 发布
阅读量634 收藏 20
点赞数 13
文章标签： 前端 vue.js javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/2301_80865164/article/details/138094418
版权

1.XmlParserUtils

package com.example.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("poet");

            //5.遍历集合,得到每一个 user 标签
            for (Element element : elements) {
   
                String ID = element.element("ID").getText();

                String author = element.element("author").getText();
  
                String gender = element.element("gender").getText();
     
                String dynasty= element.element("dynasty").getText();
         
                String title = element.element("title").getText();
 
                String style = element.element("style").getText();

                //组装数据
                Constructor<T> constructor = targetClass.getDeclaredConstructor(String.class, String.class, String.class, String.class, String.class,String.class);
                constructor.setAccessible(true);
                T object = constructor.newInstance(ID,author,gender,dynasty,title,style);

                list.add(object);
            }
        } catch (Exception e) {
            e.printStackTrace();
        }
        return list;
    }

}

2.导入poet.xml文件

3.编写poet.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="ID" label="编号" align="center" min-width="20%"></el-table-column>
    <el-table-column prop="author" label="姓名" align="center" min-width="20%"></el-table-column>
    <el-table-column prop="gender" label="性别" align="center"  min-width="20%"></el-table-column>
    <el-table-column prop="dynasty" label="朝代" align="center"  min-width="20%"></el-table-column>
    <el-table-column prop="title" label="头衔" align="center"  min-width="20%"></el-table-column>
    <el-table-column prop="style" 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('/poet').then(res=>{
        if(res.data.code){
          this.tableData = res.data.data;
        }
      });
    },
    methods: {
    }
  });
</script>
</html>

采用三种方式实现

1、常规方式，controlller控制器不分层

①Poet.java代码

package com.example.pojo;

public class Poet {
    private String ID;
    private String author;
    private String gender;
    private String dynasty;
    private String title;
    private String style;

    @Override
    public String toString() {
        return "Poet{" +
                "ID='" + ID + '\'' +
                ", author='" + author + '\'' +
                ", gender='" + gender + '\'' +
                ", dynasty='" + dynasty + '\'' +
                ", title='" + title + '\'' +
                ", style='" + style + '\'' +
                '}';
    }
    public Poet() {
    }
    public Poet(String ID, String author, String gender, String dynasty, String title,String style) {
        this.ID= ID;
        this.author = author;
        this.gender = gender;
        this.dynasty = dynasty;
        this.title = title;
        this.style=style;
    }

    public String getID() {
        return ID;
    }

    public void setID(String ID) {
        this.ID= ID;
    }

    public String getAuthor() {
        return author;
    }

    public void setAuthor(String author) {
        this.author= author;
    }

    public String getGender() {
        return gender;
    }

    public void setGender(String gender) {
        this.gender = gender;
    }

    public String getDynasty() {
        return dynasty;
    }

    public void setDynasty(String dynasty) {
        this.dynasty = dynasty;
    }

    public String getTitle() {
        return title;
    }

    public void setTitle(String title) {
        this.title = title;
    }

    public String getStyle() {
        return style;
    }

    public void setStyle(String style) {
        this.style = style;
    }
}

②PoetController.java

package com.example.controller;

import com.example.pojo.Result;
import com.example.pojo.Poet;
import com.example.utils.XmlParserUtils;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;

import java.util.List;
@RestController
public class PoetController {
    @RequestMapping("/poet")
    public Result list() {
        String file=this.getClass().getClassLoader().getResource("poet.xml").getFile();
        System.out.println(file);
        List<Poet> PoetList= XmlParserUtils.parse(file, Poet.class);
        PoetList.stream().forEach(poet->{
            //处理gender：1.男/2.女
            String gender=writer.getGender();
            if("1".equals(gender)){
                poet.setGender("男");
            }
            else if("2".equals(gender)){
                port.setGender("女");
            }
        });
        //相应数据
        return Result.success(poetList);
    }
}

2、按照MVC的分层方式实现，常规java代码方式

三层架构

①controller层

package com.example.controller;

import com.example.pojo.Poet;
import com.example.pojo.Result;
import com.example.service.PoetService;
import com.example.service.impl.PoetServiceA;
import com.example.utils.XmlParserUtils;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;

import java.util.List;

@RestController
public class PoetController {
    private PoetService poetService=new PoetServiceA();
    @RequestMapping("/poet")
    public Result list(){
        List<Poet> poetList = poetService.listpoet();
        return Result.success(poetList);
    }
}

②service层

package com.example.service.impl;

import com.example.dao.PoetDao;
import com.example.dao.impl.PoetDaoA;
import com.example.pojo.Poet;
import com.example.service.PoetService;

import java.util.List;

public class PoetServiceA implements PoetService {
    private PoetDao poetDao = new PoetDaoA();

    @Override
    public List<Poet> listpoet() {
        List<Poet> poetList = poetDao.poetList();

        poetList.stream().forEach(poet -> {
            String gender = poet.getGender();
            if ("1".equals(gender)) {
                poet.setGender("男");
            } else if ("2".equals(gender)) {
                poet.setGender("女");
            }
        });
        return poetList;
    }
}

③dao层

package com.example.dao.impl;

import com.example.dao.PoetDao;
import com.example.pojo.Poet;
import com.example.utils.XmlParserUtils;

import java.util.List;

public class PoetDaoA implements PoetDao {

    @Override
    public List<Poet> poetList() {
        String file =this.getClass().getClassLoader().getResource("poet.xml").getFile();
        System.out.println(file);
        List<Poet> poetList = XmlParserUtils.parse(file, Poet.class);
        return poetList;
    }
}

3、采用控制反转和依赖注入的MVC方式实现。

①

package com.example.controller;

import com.example.pojo.Poet;
import com.example.pojo.Result;
import com.example.service.PoetService;
import com.example.service.impl.PoetServiceA;
import com.example.utils.XmlParserUtils;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;

import java.util.List;

@RestController
public class PoetController {
    @Autowired
    private PoetService poetService;
    @RequestMapping("/poet")
    public Result list(){
        List<Poet> poetList = poetService.listpoet();
        return Result.success(poetList);
    }
}

②

package com.example.dao.impl;

import com.example.dao.PoetDao;
import com.example.pojo.Poet;
import com.example.utils.XmlParserUtils;
import org.springframework.stereotype.Component;

import java.util.List;
@Component
public class PoetDaoA implements PoetDao {

    @Override
    public List<Poet> poetList() {
        String file =this.getClass().getClassLoader().getResource("poet.xml").getFile();
        System.out.println(file);
        List<Poet> poetList = XmlParserUtils.parse(file, Poet.class);
        return poetList;
    }
}

③

package com.example.service.impl;

import com.example.dao.PoetDao;
import com.example.dao.impl.PoetDaoA;
import com.example.pojo.Poet;
import com.example.service.PoetService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Component;

import java.util.List;
@Component
public class PoetServiceA implements PoetService {
    @Autowired
    private PoetDao poetDao;

    @Override
    public List<Poet> listpoet() {
        List<Poet> poetList = poetDao.poetList();

        poetList.stream().forEach(poet -> {
            String gender = poet.getGender();
            if ("1".equals(gender)) {
                poet.setGender("男");
            } else if ("2".equals(gender)) {
                poet.setGender("女");
            }
        });
        return poetList;
    }
}

④

package com.example.service.impl;

import com.example.dao.PoetDao;
import com.example.pojo.Poet;
import org.springframework.beans.factory.annotation.Autowired;

import java.util.List;

public class PoetServiceB {
    @Autowired
    private PoetDao poetDao;

    public List<Poet> listpoet() {
        List<Poet> poetList = poetDao.poetList();

        poetList.stream().forEach(poet -> {
            String gender = poet.getGender();
            if ("1".equals(gender)) {
                poet.setGender("男士");
            } else if ("2".equals(gender)) {
                poet.setGender("女士");
            }
        });
        return poetList;
    }
}

2301_80865164
关注
  • 13
    点赞
  • 踩
  • 20
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
web第三次作业2
m0_74973184的博客
03-22 73
如题
web第四次作业
2301_81601351的博客
07-21 191
【代码】web第四次作业。
web技术第四次作业
jushiwu的博客
03-17 212
include指令标记与动作标记的区别 include 指令标记的作用就是将JSP文件、HTML网页文件或其他文本文件静态嵌入到当前的JSP网页中。 include动作标记的作用就是将JSP文件、HTML网页文件或其他文本文件动态嵌入到当前的JSP网页中。 静态嵌入就是“先包含后处理”，在编译阶段完成对文件的嵌入。也就是先将当前JSP页面与要嵌入的文件合并成一个新的JSP页面，然后再由JSP引擎将...
java web第四次作业
cyh20040921的博客
04-22 133
方法一完成方法二 完成方法三完成。
JAVA WEB 第四次作业
zybzbharl的博客
11-16 304
Web前端第四次作业
m0_75208155的博客
06-25 314
【代码】Web前端第四次作业。
Web 第四次课后作业
A_amx的博客
04-25 131
Web应用技术第四次作业
cyxdekongjian的博客
05-14 307
在包下新建Dao、service文件夹，在Dao文件夹中编写一个接口PoetDao。为dao层及service层加入@Component注解。在Dao文件夹下新建一个类用来实现接口PoetDao。controller中调用service来响应数据。运行代码后，在网页上打开。
web第二次作业
Jie_17的博客
07-08 128
【代码】web第二次作业。
web前端html5网页作业,Web前端开发第一次作业
weixin_39957027的博客
06-21 754
(1)分别说出什么是HTML,XHTML,HTML5HTML为一种超文本标记语言,用这种语言浏览器几乎都能识别.独立于各种操作系统平台.XHTML为一种可扩展超文本标记语言,表现方式于超文本标记语言类似,不过语法比较严格.HTML5是用于取代HTMLH和XHTML的一个标准版本.(2)写出HTML的语法语法不区分字母大小写。(3)HTML中的注释和CSS中的注释HTML的注释:CSS注释:(4)C...
web第二次作业.zip 表单设计，web前端
11-01
"web第二次作业.zip"这个压缩包文件似乎包含了关于Web前端开发中表单设计的学习资料，具体分为三个部分：2_files、1_files和电影网_files。下面将对这些知识点进行详细解释。 1. **HTML表单基础**： HTML表单是...
Web技术第一次网上作业.doc
04-18
Web 技术第一次网上作业答案 本资源摘要信息涵盖了 Web 技术第一次网上作业的所有问题和答案，涵盖了 Web 技术的基础知识点，包括WWW 服务器、网页设计、HTML 语言、动态网页技术、网页 Elements 等。 一、WWW ...
在线：大学第四次作业
02-21
这个文件名暗示了一个与在线购物平台“Daraz”相关的项目，可能是学生第四次作业的一部分。"master"通常指的是Git仓库的主分支，这表明项目使用了版本控制系统Git来管理代码。DarazOnline可能是学生尝试创建的一个...
第六次作业 张佳.zip
12-25
很抱歉，但根据您给出的信息，"第六次作业 张佳.zip"是一个压缩文件，而描述中并未提供具体的作业主题或涉及的IT知识点。标签为空，也无法提供额外的上下文。压缩文件内的子文件列表只给出了同名的"第六次作业 张佳...
第四次作业计算机网络基础.pdf
10-04
当你ping一个远程IP并收到4个（即d选项）应答时，这表示你成功地通过了默认网关，达到了目标主机。 2. **TCP与UDP协议**：TCP（传输控制协议）是一种可靠的面向连接的协议，负责数据的顺序传输和错误控制。相反，...
5.CSS学习（浮动）
最新发布
ShawLee0925的博客
07-23 152
css浮动——float特点
Vue使用FullCalendar实现日历/周历/月历
_小郑有点困了的博客
07-23 62
需求背景：项目上遇到新需求，要求实现工单以日/周/月历形式展示。而且要求不同工单根据状态显示不同颜色，一个工单内部，需要以不同颜色显示三个阶段。
谷粒商城实战笔记-39-前端基础-Vue-指令-v-on、v-for、v-if
epitomizelu的专栏
07-20 913
v-on 是 Vue.js 中的一个指令，用于在 DOM 元素上监听用户事件，并在事件触发时执行相应的 JavaScript 函数。它提供了一种将 Vue 实例中的方法与 DOM 事件关联起来的方式，使得你可以轻松地对用户交互做出响应。v-on 指令的基本语法是在元素上添加 v-on:event-name=“method”，其中 event-name 是你要监听的 DOM 事件类型（如 click、mouseover、keydown 等），method 则是 Vue 实例中定义的方法名。
VUE 子组件可以直接改变父组件的数据吗
Cshaosun的博客
07-23 57
如果子组件需要修改父组件的数据，‌应该通过触发一个自定义事件来通知父组件进行数据的变更。‌父组件在接收到子组件触发的事件后，‌可以修改数据，‌从而间接地改变父组件的数据。‌这种方式通过明确的事件通信机制，‌保证了数据流的单向性和组件之间的解耦。需要注意的是，‌虽然Vue提供了一些特殊的方法来实现子组件修改父组件数据，‌但这种方式打破了数据流的单向性，‌增加了组件之间的耦合性，‌因此应谨慎使用。在Vue中，‌如果确实需要在子组件中修改父组件的数据，‌可以通过以下步骤实现：‌。
python Web django期末大作业
05-26
- 网站主题：可以是电商、社交、博客等，需要与 Django Web 开发相关。 - 功能模块：需要确定网站的功能模块，例如用户注册、登录、商品展示、购物车、订单管理、评论等等。 - 技术要求：需要确定使用的技术，例如...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值