《精通 ASP.NET MVC 4》----2.3 渲染Web页面

简介: 前面例子的输出并不是HTML,只是一个字符串“Hello, world”。为了产生一个对浏览器请求进行响应的HTML,需要创建一个视图(View)。

本节书摘来自异步社区《精通 ASP.NET MVC 4》一书中的第2章,第2.3节,作者: 【美】Adam Freeman ,译者: 李萍 , 徐燕萍 , 林逸 , 更多章节内容可以访问云栖社区“异步社区”公众号查看。

2.3 渲染Web页面

精通 ASP.NET MVC 4
前面例子的输出并不是HTML,只是一个字符串“Hello, world”。为了产生一个对浏览器请求进行响应的HTML,需要创建一个视图(View)。

2.3.1 创建并渲染视图

要做的第一件事是修改Index动作方法,如清单2-3所示。

清单2-3 修改控制器以渲染一个视图

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
namespace PartyInvites.Controllers {
    public class HomeController : Controller {
        public **ViewResult** Index() {
            return **View()**;
        }
    }
}

清单2-3中的改动以黑体显示。当从一个动作方法返回一个ViewResult对象时,便是在指示MVC去渲染一个视图。通过调用不带参数的View方法来创建这个ViewResult对象。这是告诉MVC——去渲染该动作的默认视图。

如果此时运行这个应用程序,就可以看到MVC框架正试图查找要使用的默认试图,并显示图2-8所示的错误消息。

这个错误消息是很有帮助的,它不仅解释了MVC未找到该动作方法的视图,而且还显示出它查找了哪些地方。这是MVC约定的另一个很好的例子:视图是通过命名约定与动作方法相关联的。这个动作方法叫作“Index”,控制器叫作“Home”。从图2-8中可以看出,MVC试图在“Views”文件夹中查找有这个名字的不同文件。

为了创建一个视图,停止调试器,右击HomeController.cs代码文件中的动作方法(在方法名上,或在方法体内),从弹出菜单选择“添加视图”,打开“添加视图”对话框,如图2-9所示。

去掉“Use a layout or master page(使用布局或母版页)”复选框。本例不使用布局,但读者将在第7章看到布局的使用。点击“Add(添加)”按钮,Visual Studio将在Views/Home文件夹中创建一个名为“Index.cshtml”的视图文件。如果回看刚才图2-8显示的错误消息,就会发现这个新文件是MVC试图寻找的文件之一。

提示:.cshtml文件扩展名表示是一个由Razor处理的C#视图。MVC的早期版本建立在ASPX视图引擎之上,其视图文件扩展名为.aspx。
Visual Studio打开Index.cshtml文件以便编辑。读者将看到该文件主要含有HTML。不同的是,会看到类似下面的部分。


e56754b58e46bfae36abd9750bd91661bccf955a
@{
    Layout = null;    
}

这是一个由Razor视图引擎来解释的代码块。这是一个相当简单的例子。它只是告诉Razor并未选用布局(此刻略去Razor,稍后再回头讨论)。现在,将清单2-4所示的黑体内容添加到Index.cshtml文件中。

清单2-4 添加到视图的HTML


eb921478af4fb32477efef1b4c7608b60016f839

这一添加显示了另一种简单消息(用HTML标记显示出来的消息,而不是前面那种由动作方法显示的字符串消息——译者注)。从“Debug(调试)”菜单选择“Start Debugging(开始调试)”来运行该应用程序,并测试此视图。读者可以看到类似于图2-10所示的内容。


6d16bd21f49a6e54bb60830ff8c765af55b80ca2

在最初创建Index动作方法时,它返回了一个字符串值。这意味着,MVC除了把这个字符串传递给浏览器之外,未做其他事情。现在,Index方法返回了一个ViewResult,这是指示MVC渲染一个视图并返回HTML。清单2-4并未告诉MVC应该使用哪个视图,其实它运用了命名约定,以自动找到一个视图。这个约定是,视图具有动作方法的名字,并位于以控制器命名的文件夹之中——~/Views/Home/Index.cshtml。

除了字符串和ViewResult对象之外,还可以从动作方法返回其他结果。例如,如果返回一个RedirectResult,可以使浏览器被重定向到另一个URL。如果返回一个HttpUnauthorizedResult,会强迫用户进行登录。这些对象统称为动作结果(Action Result),而且它们都是从ActionResult类派生而来的。动作结果系统使开发者能够封装并重用动作中的常用响应。随着本书的进展,将介绍更多内容,并演示一些复杂的运用。

2.3.2 添加动态输出

一个Web应用程序平台的全部目标是构造并显示动态输出。在MVC中,控制器的工作是构造一些数据,并将其传递给视图,而视图负责把它渲染成HTML。

注意:现在,有很多人都把“渲染”说成“呈现”,其实这种说法是不正确的。Web页面从服务器到浏览器的整个呈现过程实际上分为三步。第一步是通过视图引擎对视图文件进行解析,将视图文件中的代码转换成HTML标记,这一步叫作渲染。第二步是将渲染后的HTML标记传递给客户端浏览器,这一步是页面的传递。第三步是浏览器接收到HTML后对其进行处理并呈现为Web页面,这一步才叫作呈现。由此可见,渲染是把页面的非HTML代码(控件、页面代码等)转换成HTML标记,这一步工作是由服务器完成的。而呈现是将HTML显示成Web页面,这一步工作是由浏览器完成的。渲染和呈现是整个页面处理过程的两个不同阶段,更不能把这两步工作混谈为只有“呈现”这么一步——译者注
把数据从控制器传递给视图的一种方式是使用ViewBag(视图包)对象,它是Controller基类的一个成员。ViewBag是一种动态对象,可以给它赋任意属性,使这些属性的值在随后渲染的视图中可用。清单2-5演示了在HomeController.cs文件中以这种方式传递一些简单的动态数据。

清单2-5 设置一些视图数据

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
namespace PartyInvites.Controllers {
    public class HomeController : Controller {
        public ViewResult Index() {
**int hour = DateTime.Now.Hour;**
**ViewBag.Greeting = hour < 12 ? "Good Morning" : "Good Afternoon";**
            return View();
        }
    }
}

将一个值赋给ViewBag.Greeting属性时,便是为视图提供数据。ViewBag是一种动态对象,Greeting属性直到给其赋值的那一刻才会存在——这让用户能够以自如而流畅的方式将数据从控制器传递给视图,而不必提前定义类。

在视图中再次查阅ViewBag.Greeting属性,便可获得其数据值,正如清单2-6所演示的那样,它显示了对Index.cshtml文件所做的修改。

清单2-6 接收ViewBag的数据值


25287a0873c68ee83b4c1e703f80e4c7f930e301

添加到清单2-6的是一个Razor表达式。当人们在控制器的Index方法中调用View方法时,MVC框架会定位Index.cshtml视图文件,并要求Razor视图引擎解析该文件的内容。Razor会寻找类似于在该清单中所添加的这种表达式,并处理它们。在此例中,处理该表达式意味着,在视图中插入在动作方法中赋给ViewBag.Greeting属性的值(这就是译者前面所提到的视图渲染过程——译者注)。

对属性名Greeting没有特别的要求,可以用任意属性名来代替它,它会一样工作。当然,通过对多个属性赋值,可以将多个数据值从控制器传递给视图。通过运行该项目,可以看到第一个动态的MVC输出,如图2-11所示(请读者体会“动态”二字:动作方法可以根据不同的情况动态地对Greeting属性赋不同的值,而视图无须做任何修改,便可以动态地显示出正确的数据——译者注)。


cb7683ea6106c7a64ace0e3ec11d3f727815ab45

本文仅用于学习和交流目的,不代表异步社区观点。非商业转载请注明作译者、出处,并保留本文的原始链接。

相关文章
|
15天前
|
自然语言处理 Java 数据库连接
掌握JSP页面编程:动态生成Web内容
【4月更文挑战第3天】Java Server Pages (JSP) 是一种用于创建动态Web内容的Java技术,它结合HTML并允许在页面中嵌入Java代码。JSP支持代码片段、表达式语言(EL)和JSTL标签库,简化动态内容生成。当服务器接收到请求时,执行JSP中的Java代码并将结果嵌入HTML返回给客户端。示例展示了如何显示当前日期和时间。JSP可与Servlet、JavaBeans、数据库等结合,用于构建功能丰富的交互式Web应用。
掌握JSP页面编程:动态生成Web内容
|
24天前
|
机器学习/深度学习 人工智能 前端开发
机器学习PAI常见问题之web ui 项目启动后页面打不开如何解决
PAI(平台为智能,Platform for Artificial Intelligence)是阿里云提供的一个全面的人工智能开发平台,旨在为开发者提供机器学习、深度学习等人工智能技术的模型训练、优化和部署服务。以下是PAI平台使用中的一些常见问题及其答案汇总,帮助用户解决在使用过程中遇到的问题。
|
2月前
|
存储 开发框架 NoSQL
ASP.NET WEB——项目中Cookie与Session的用法
ASP.NET WEB——项目中Cookie与Session的用法
29 0
|
2月前
|
开发框架 前端开发 .NET
ASP.NET WEB——项目创建与文件上传操作
ASP.NET WEB——项目创建与文件上传操作
46 0
|
1月前
|
设计模式 前端开发 Shell
Python生成Web页面Web框架
Python生成Web页面Web框架
16 0
|
1月前
|
开发框架 前端开发 .NET
C# .NET面试系列六:ASP.NET MVC
<h2>ASP.NET MVC #### 1. MVC 中的 TempData\ViewBag\ViewData 区别? 在ASP.NET MVC中,TempData、ViewBag 和 ViewData 都是用于在控制器和视图之间传递数据的机制,但它们有一些区别。 <b>TempData:</b> 1、生命周期 ```c# TempData 的生命周期是短暂的,数据只在当前请求和下一次请求之间有效。一旦数据被读取,它就会被标记为已读,下一次请求时就会被清除。 ``` 2、用途 ```c# 主要用于在两个动作之间传递数据,例如在一个动作中设置 TempData,然后在重定向到另
95 5
|
2月前
|
SQL 开发框架 .NET
ASP.NET WEB+EntityFramework数据持久化——考核练习库——1、用户管理系统(考点:查询列表、增加、删除)
ASP.NET WEB+EntityFramework数据持久化——考核练习库——1、用户管理系统(考点:查询列表、增加、删除)
67 0
|
2月前
|
SQL 开发框架 前端开发
ASP.NET WEB项目中GridView与Repeater数据绑定控件的用法
ASP.NET WEB项目中GridView与Repeater数据绑定控件的用法
32 0
|
2月前
|
SQL 开发框架 .NET
ASP.NET Web——GridView完整增删改查示例(全篇幅包含sql脚本)大二结业考试必备技能
ASP.NET Web——GridView完整增删改查示例(全篇幅包含sql脚本)大二结业考试必备技能
32 0