MVC怎么实现视图层分离

发布时间:2022-02-25 09:52:46 作者:iii
来源:亿速云 阅读:153

本篇内容介绍了“MVC怎么实现视图层分离”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!

什么是MVC

MVC模式,就是将原本的web代码,按照功能的不同,划分成控制层,视图层和模型层三个层次,以web项目为例,当请求访问时,由控制层负责处理,控制层调用模型层对请求进行处理,最后使用表现层展示出来。

实战

请求页面:(这是用来请求的页面,放出来以供参考)

<!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>Document</title>
</head>
<body>
	<h2>优质的W3C分类选择</h2>
	<form action="hello-servlet" method="get">
		<select name="class" id="ke">
			<option value="qd">前端开发</option>
			<option value="hd">后端开发</option>
			<option value="db">数据库</option>
			<option value="cp">计算机原理</option>
			<option value="Android">移动开发</option>
			<option value="other">其他</option>
		</select>
		<input type="submit" value="提交">
	</form>
</body>
</html>

servlet(这里我们用3.0以上版本的servlet,使用注解替代web.xml):

import java.io.*;
import javax.servlet.http.*;
import javax.servlet.annotation.*;

@WebServlet(name = "helloServlet", value = "/hello-servlet")
public class HelloServlet extends HttpServlet {
    public void doGet(HttpServletRequest request, HttpServletResponse response) throws IOException {
        String classname = "";
        String url = "";
        String element = "";
        classname = request.getParameter("class");
        if (classname.equals("qd")) {//目前只做前端判定,后期再增加
            url = "https://www.yisu.com/courses?direction=2120&tag=0&type=&condition=&order=";
            element = "前端微课";
        }
        response.setContentType("text/html");
        response.setCharacterEncoding("utf-8");
        PrintWriter out = response.getWriter();
        out.println("<!DOCTYPE html>\n" +
                "<html lang=\"en\">\n" +
                "<head>\n" +
                "\t<meta charset=\"UTF-8\">\n" +
                "\t<meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n" +
                "\t<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n" +
                "\t<title>Document</title>\n" +
                "</head>\n" +
                "<body>");
        out.println("<h2>以下是W3C平台优秀的前端微课介绍,点击链接即可前往</h2>");
        out.println("<a href =\"" + url + "\" >" + element + "</a>");
        out.println("</body></html>");
    }
}

可以看到,上面的代码使用servlet进行HTML代码的输出,十分的混乱,而且其中夹杂着一些判定(这部分功能应该交给模型层进行处理)。接下来我们将其中的html代码进行剥离,使用jsp来进行页面的输出。

result.jsp(负责返回页面的jsp):

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!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>Document</title>
</head>
<body>
    <%
        String link = (String) request.getAttribute("url");
        String text = (String) request.getAttribute("element");
    %>
    <h2>以下是W3C平台优秀的前端微课介绍,点击链接即可前往</h2>
    <a href ="<%= link%>"><%= text%></a>
</body>
</html>

同时,对servlet进行对应的修改(主要是删除原来的HTML输出代码,将需要传递给页面的数据封装进请求后然后将请求转发给jsp)。

现在的servlet的get方法如下:

 public void doGet(HttpServletRequest request, HttpServletResponse response) throws IOException {
        String classname = "";
        String url = "";
        String element = "";
        classname = request.getParameter("class");
        if (classname.equals("qd")) {//目前只做前端判定,后期再增加
            url = "https://www.yisu.com/courses?direction=2120&tag=0&type=&condition=&order=";
            element = "前端微课";
        }

        request.setAttribute("url",url);
        request.setAttribute("element",element);
        RequestDispatcher view = request.getRequestDispatcher("result.jsp");
        try {
            view.forward(request,response);
        } catch (ServletException e) {
            e.printStackTrace();
        }
    }

这样子就完成了视图层的分离了。

“MVC怎么实现视图层分离”的内容就介绍到这里了,感谢大家的阅读。如果想了解更多行业相关的知识可以关注亿速云网站,小编将为大家输出更多高质量的实用文章!

推荐阅读:
  1. The Model–View Transform(模型视口变换)
  2. 遮罩和图层

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

mvc

上一篇:html页面如何跟php文件连接

下一篇:xlwings怎么安装和使用

相关阅读

您好,登录后才能下订单哦!

密码登录
登录注册
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》