在asp.net core中Web系统 MVC视图的使用
yuyutoo 2024-12-03 19:35 2 浏览 0 评论
一.MVC视图
在Web开发的MVC和Razor中,都有使用视图,在Razor中称为"页"。.cshtml视图是嵌入了Razor标记的HTML模板。 Razor 标记使用C#代码,用于与HTML 标记交互以生成发送给客户端的网页。在MVC目录结构中,Views / [ControllerName] 文件夹下用于创建视图,其中Views/Shared 文件夹下的视图是控制器共享的视图。
1.1 视图页Razor 标记
下面是Views/Home 文件夹中创建一个 About.cshtml 文件,呈现的视图如下:
@{
ViewData["Title"] = "About";
}
<h2>@ViewData["Title"].</h2>
<h3>@ViewData["Message"]</h3>
Razor 标记以 @ 符号开头。后面的大括号 { ... } 括住的是 Razor 代码块,是运行 C# 语句。 只需用 @ 符号来引用值,即可在 HTML 中显示这些值。比如上面h2和h3标签。
1.2 控制器指定视图
通常以 ViewResult 的形式从Action返回结果到视图,这是一种 ActionResult结果类型(Web api中有讲到)。但通常不会这样做。 因为大多数控制器均继承自Controller,因此只需使用 View 方法即可返回 ViewResult。示例如下:
public IActionResult About()
{
ViewData["Message"] = "Your application description page.";
return View();
}
View 方法有多个重载。 可选择指定:
//要返回的显式视图
return View("Orders");
//要传递给视图的模型(实体)对象
return View(Orders);
//视图和模型
return View("Orders", Orders);
1.3 视图发现
Action返回一个视图时, 这个过程叫“视图发现”。默认的 return View(); 将返回与当前Action方法同名的视图。搜索匹配的视图文件顺序规则如下:
Views/[ControllerName]/[ViewName].cshtml
Views/Shared/[ViewName].cshtml
当return View()时,首先在 Views/[ControllerName] 文件夹中搜索该视图。 如果在此处找不到匹配的视图,则会在“Shared”文件夹中搜索该视图。
在返回视图时,可以提供视图文件路径。 如果使用绝对路径(“/”或“~/”开头),必须指定 .cshtml 扩展名:
return View("Views/Home/About.cshtml");
也可使用相对路径在不同目录中指定视图,而无需指定 .cshtml 扩展名:
return View("../Manage/Index");
可以用“./”前缀来指示当前的控制器特定目录:
return View("./About");
1.4 向视图传递数据
可以使用多种方法将数据传递给视图。包括:(1)强类型数据:viewmodel。(2)弱类型数据ViewData (ViewDataAttribute)、ViewBag。ViewBag 在 Razor 页中不可用。
(1) 强类型数据 viewmodel
在传递数据到视图中,最可靠的是使用强类型数据,因为编译时能检查并且有智能感知。在视图页中使用@model指令来指定模型(可以是实体或集合泛型实体)。如下所示,其中前端的WebApplication1.ViewModels.Address是实体类命令空间,通过后端返回view强类型映射:
@model WebApplication1.ViewModels.Address
<h2>Contact</h2>
<address>
@Model.Street<br>
@Model.City, @Model.State @Model.PostalCode<br>
<abbr title="Phone">P:</abbr> 425.555.0100
</address>
public IActionResult Contact()
{
ViewData["Message"] = "Your contact page.";
var viewModel = new Address()
{
Name = "Microsoft",
Street = "One Microsoft Way",
City = "Redmond",
State = "WA",
PostalCode = "98052-6399"
};
//返回强类型
return View(viewModel);
}
(2) 弱类型数据(ViewData、ViewData 属性和 ViewBag)
视图还可以访问弱类型(也称为松散类型)的数据集合。可以使用弱类型数据集合将少量数据传入及传出控制器和视图。ViewData 属性是弱类型对象的字典。ViewBag 属性是 ViewData 的包装器,为基础 ViewData 集合提供动态属性。ViewData派生自 ViewDataDictionary,ViewBag派生自 DynamicViewData。
ViewData 和 ViewBag 在运行时进行动态解析。 由于它们不提供编译时类型检查,因此使用这两者通常比使用 viewmodel 更容易出错。建议尽量减少或根本不使用 ViewData 和 ViewBag。
ViewData介绍
下面是一个ViewData存储对象,在视图上强制转换为特定类型(Address)。
public IActionResult SomeAction()
{
ViewData["Greeting"] = "Hello";
ViewData["Address"] = new Address()
{
Name = "Steve",
Street = "123 Main St",
City = "Hudson",
State = "OH",
PostalCode = "44236"
};
return View();
}
@{
// Since Address isn't a string, it requires a cast.
var address = ViewData["Address"] as Address;
}
@ViewData["Greeting"] World!
<address>
@address.Name<br>
@address.Street<br>
@address.City, @address.State @address.PostalCode
</address>
ViewData 特性介绍
可以在控制器或 Razor 页面模型上,使用 [ViewData] 修饰属性。下面是一个示例:
public class HomeController : Controller
{
[ViewData]
public string Title { get; set; }
public IActionResult About()
{
Title = "About Us";
ViewData["Message"] = "Your application description page.";
return View();
}
}
//通过字典key取出
<title>@ViewData["Title"] - WebApplication</title>
ViewBag介绍
ViewBag 不需要强制转换,因此使用起来更加方便。下面示例如下:
public IActionResult SomeAction()
{
// Greeting不需要先声明,Address 也一样,因为是Dynamic类型
ViewBag.Greeting = "Hello";
ViewBag.Address = new Address()
{
Name = "Steve",
Street = "123 Main St",
City = "Hudson",
State = "OH",
PostalCode = "44236"
};
return View();
}
@ViewBag.Greeting World!
<address>
@ViewBag.Address.Name<br>
@ViewBag.Address.Street<br>
@ViewBag.Address.City, @ViewBag.Address.State @ViewBag.Address.PostalCode
</address>
更多视图功能包括:标记帮助程序、服务注入视图,视图组件等
相关推荐
- TCP协议原理,有这一篇就够了
-
先亮出这篇文章的思维导图:TCP作为传输层的协议,是一个软件工程师素养的体现,也是面试中经常被问到的知识点。在此,我将TCP核心的一些问题梳理了一下,希望能帮到各位。001.能不能说一说TC...
- Win10专业版无线网络老是掉线的问题
-
有一位电脑基地的用户,使用...
- 学习计算机网络需要掌握以下几方面基础知识
-
计算机基础知识操作系统:了解常见操作系统(如Windows、Linux)的基本操作和网络配置,例如如何设置IP地址、子网掩码、网关和DNS服务器等,以及如何通过命令行工具(如ping、tr...
- 网络工程师的圣经!世界级网工手绘268张图让TCP/IP直接通俗易懂
-
要把知识通俗地讲明白,真的不容易。——读者说TCP/IP从字面意义上讲,有人可能会认为TCP/IP是指TCP和IP两种协议。实际生活当中有时候也确实就是这两种协议。然而在很多情况下,它只是...
- 三分钟了解通信知识TCP与IP协议(含“通信技术”资料分享)
-
TCP/IPTCP/IP分层模型①应用层...
- 网闸与防火墙:网络安全设备的差异与应用
-
在网络安全领域,网闸(安全隔离网闸,GAP)和防火墙(Firewall)是两类重要的防护设备。尽管它们都服务于网络安全防护,但在设计理念、技术原理、安全效能及适用场景等方面存在显著差异,以下从五个维度...
- S7-300的TCP/IP通信
-
一、首先在项目中创建2个S7-300的站点;二、硬件组态中,设置合适的TCP/IP地址,在同一网段内;...
- 西门子S7-1500 PLC的 MODBUS TCP通信
-
MODBUSTCP使MODBUS_RTU协议运行于以太网,MODBUSTCP使用TCP/IP和以太网在站点间传送MODBUS报文,MODBUSTCP结合了以太网物理网络和网络标准TC...
- 系统规划与管理师新版备考必备:第7章考点思维导图解析
-
备考系统规划与管理师的小伙伴们,福利又来啦!今天为大家带来《系统规划与管理师(第2版)》第7章考点的思维导图,助你高效梳理重点,让备考更有方向!...
- TCP/IP、Http、Socket 有何区别与联系?
-
HTTP协议对应于应用层,Socket则是对TCP/IP协议的封装和应用(程序员层面上)。HTTP是应用层协议,主要解决如何包装数据。而我们平时说的最多的Socket是什么呢?实际上...
- 西门子PLC串口协议与以太网通信协议对比
-
西门子plc品牌众多,通信协议的类型就更多了,具体可分为串口协议和以太网通信协议两大类。...
- 网络编程懒人入门(十三):一泡尿的时间,快速搞懂TCP和UDP的区别
-
本文引用了作者Fundebug的“一文搞懂TCP与UDP的区别”一文的内容,感谢无私分享。1、引言...
- 程序员必备的学习笔记《TCP/IP详解(一)》
-
为什么会有TCP/IP协议在世界上各地,各种各样的电脑运行着各自不同的操作系统为大家服务,这些电脑在表达同一种信息的时候所使用的方法是千差万别。就好像圣经中上帝打乱了各地人的口音,让他们无法合作一样...
- 一文读懂TCP/IP协议工作原理和工作流程
-
简述本文主要介绍TCP/IP协议工作原理和工作流程。含义TCP/IP协议,英文全称TransmissionControlProtocol/InternetProtocol,包含了一系列构成互联网...
- 如何在 Windows 10 和 Windows 11 上重置 TCP/IP 堆栈
-
传输控制协议/Internet协议,通常称为TCP/IP,是您的WindowsPC如何与Internet上的其他设备进行通信的关键部分。但是当事情出错时会发生什么?你如何解决它?幸运的...
你 发表评论:
欢迎- 一周热门
-
-
前端面试:iframe 的优缺点? iframe有那些缺点
-
带斜线的表头制作好了,如何填充内容?这几种方法你更喜欢哪个?
-
漫学笔记之PHP.ini常用的配置信息
-
其实模版网站在开发工作中很重要,推荐几个参考站给大家
-
推荐7个模板代码和其他游戏源码下载的网址
-
[干货] JAVA - JVM - 2 内存两分 [干货]+java+-+jvm+-+2+内存两分吗
-
正在学习使用python搭建自动化测试框架?这个系统包你可能会用到
-
织梦(Dedecms)建站教程 织梦建站详细步骤
-
【开源分享】2024PHP在线客服系统源码(搭建教程+终身使用)
-
2024PHP在线客服系统源码+完全开源 带详细搭建教程
-
- 最近发表
- 标签列表
-
- mybatis plus (70)
- scheduledtask (71)
- css滚动条 (60)
- java学生成绩管理系统 (59)
- 结构体数组 (69)
- databasemetadata (64)
- javastatic (68)
- jsp实用教程 (53)
- fontawesome (57)
- widget开发 (57)
- vb net教程 (62)
- hibernate 教程 (63)
- case语句 (57)
- svn连接 (74)
- directoryindex (69)
- session timeout (58)
- textbox换行 (67)
- extension_dir (64)
- linearlayout (58)
- vba高级教程 (75)
- iframe用法 (58)
- sqlparameter (59)
- trim函数 (59)
- flex布局 (63)
- contextloaderlistener (56)