MVC5+EF6 入门完整教程六

简介: 原文:MVC5+EF6 入门完整教程六本篇我们谈谈分部视图(Partial View)。 上篇文章提到过Partial和Action这两个helper, 本篇文章主要就结合这两个helper来讲解分部视图(Partial View)的应用。
原文: MVC5+EF6 入门完整教程六

本篇我们谈谈分部视图(Partial View)。

上篇文章提到过Partial和Action这两个helper, 本篇文章主要就结合这两个helper来讲解分部视图(Partial View)的应用。

文章提纲

  • 理论基础
  • 详细步骤
  • 总结

理论基础 – 分部视图

Partial View指可以应用于View中以作为其中一部分的View的片段(类似于之前的user control), 可以像类一样,编写一次, 然后在其他View中被反复使用。

一般放在"Views/Shared"文件夹中以共享。

创建Partial View:一般直接右键"Views/Shared"文件夹添加分部视图。

使用Partial View有两类helper :

Html.Partial / Html.RenderPartial

Html.Action / Html.RenderAction

详细步骤

大概五年前我开发过一个iPortal(类似于以前的iGoogle,现在iGoogle已经关闭), 其他类似的参考网站:http://dropthings.omaralzabir.com/

里面有一个个可以自定义的widget,下面我们就开发一个简单的widget来说明Partial View的用法。

创建分部视图

如下图,创建 _PartialPageWidget.cshtml

我们做一个简陋的widget.

参考下面的图,定义widget的HTML结构。

借用了bootstrap中panel的样式,结构如下。

通过Html.Partial / Html.RenderPartial 使用

直接应用Html.Partial或Html.RenderPartial辅助方法比较简单。

打开之前建好的Views/MVCDemo/Index.cshtml文件,添加如下内容:

显示结果:

通过Html.Action / Html.RenderAction 使用

通过Html.Action/Html.RenderAction使用稍微复杂一点,分成两步。

  1. 在要显示的View所对应的Controller中心增加一个Action.

    还用上面这个页面,我们在MVCDemoController.cs中增加一个Action

    做个简单的说明:

    1. [ChildActionOnly] 表示这个Action只应作为子操作进行调用。也就是说直接通过 controller/action这样的网址是不能访问的,会提示只能由子请求访问的错误。
    2. 必须返回一个PartialView
  2. 在View中添加相关代码

    显示结果和上一种方法一样

两种使用方式小结

当View中引用了一个或多个分部视图时,此View与各分部视图默认得到一样的数据,也就是说View及其中所有的Partial View默认情况下共享View中的ViewData和ViewBag.

需要使View和其中引入的Partial View有不同的数据,需要通过Html.Action/Html.RenderAction辅助方法, 并在对于被调用的Action中设置对应的数据。

另外还有几点需要注意:

  1. XXX和RenderXXX的区别在于,一个是直接返回字符串,另外一个是直接写入到相应输出流,因此不能直接放在代码表达式中,必须放在代码块中。

    前面的示例中两种写法是等价的。RenderXXX有轻微的性能优势,在大量的RenderXXX运行时,才能反映出性能上的优势。

  2. Partial/RenderPartial通常在单独的文件夹中应用视图标记来帮助View渲染视图模型的一部分。

    Action/RenderAction执行单独Controller中的Action来显示结果,提供了更多的灵活性,例如利用单独的Controller传递不同值。文章最后我们会举个例子说明。

  3. Partial/RenderPartial和Action/RenderAction的参数分别是 partialView和 Action的名字。当然还有其他的重载函数,我们只说最常用的。应用时可以按照我们前面举的例子。

Html.Partial和Html.Action差异举例

最后我们举个例子说明两种用法的差别。

  1. 新建一个Partial View

  2. Controller中新建两个Action,SharedDateDemo和PartialViewDate.

    根据SharedDateDemo生成主View, PartialViewDate供Html.Action调用

  3. 主View: SharedDateDemo.cshtml分别显示

    主View的时间;

    用Html.Partial调用Partial View的时间;

    用Html.Action调用Partial View的时间。

    显示结果:

    上面结果可以清晰的看到:

    1. View及其中所有的Partial View默认情况下共享View中的ViewData和ViewBag
    2. 可以通过Html.Action, 配合被调用的Action改变传递不同的数据

总结

本次我们主要讲解了Partial View这一实用功能的使用。

Html.Partial使用方便,在不需要改变数据内容时非常方便。

Html.Action 使用更加灵活,可以根据业务要求按需定制Partial View显示内容。

请充分理解本篇文章所讲的几个例子。

好了,今天就到这里。

欢迎大家多多评论,让下一篇文章更好 :)

目录
相关文章
|
开发框架 前端开发 JavaScript
ASP.NET MVC 教程
ASP.NET 是一个使用 HTML、CSS、JavaScript 和服务器脚本创建网页和网站的开发框架。
242 7
|
前端开发 安全 Dubbo
Spring MVC & Boot & Cloud 技术教程汇总(长期更新)
Java成神之路技术整理(长期更新) 以下是Java技术栈微信公众号发布的关于 Spring/ Spring MVC/ Spring Boot/ Spring Cloud 的技术干货,本文长期更新。
465 0
|
前端开发 数据库 存储
MVC5+EF6 入门完整教程11--细说MVC中仓储模式的应用
原文:MVC5+EF6 入门完整教程11--细说MVC中仓储模式的应用   摘要: 第一阶段1~10篇已经覆盖了MVC开发必要的基本知识。 第二阶段11~20篇将会侧重于专题的讲解,一篇文章解决一个实际问题。
1416 0
|
XML 前端开发 定位技术
MVC 5 + EF6 入门完整教程14 -- 动态生成面包屑导航
原文:MVC 5 + EF6 入门完整教程14 -- 动态生成面包屑导航 上篇文章我们完成了 动态生成多级菜单 这个实用组件。 本篇文章我们要开发另一个实用组件:面包屑导航。 面包屑导航(BreadcrumbNavigation)这个概念来自童话故事"汉赛尔和格莱特",当汉赛尔和格莱特穿过森林时,不小心迷路了,但是他们发现在沿途走过的地方都撒下了面包屑,让这些面包屑来帮助他们找到回家的路。
1382 0
|
Web App开发 前端开发 容器
MVC5+EF6 入门完整教程13 -- 动态生成多级菜单
原文:MVC5+EF6 入门完整教程13 -- 动态生成多级菜单 稍微有一定复杂性的系统,多级菜单都是一个必备组件。 本篇专题讲述如何生成动态多级菜单的通用做法。 我们不用任何第三方的组件,完全自己构建灵活通用的多级菜单。
1232 0
|
Web App开发 前端开发
MVC5+EF6 入门完整教程12--灵活控制Action权限
原文:MVC5+EF6 入门完整教程12--灵活控制Action权限 大家久等了。 本篇专题主要讲述MVC中的权限方案。 权限控制是每个系统都必须解决的问题,也是园子里讨论最多的专题之一。 前面的系列文章中我们用到了 SysUser, SysRole, SysUserRole 这几个示例表。
1342 0
|
SQL 安全 测试技术
MVC5+EF6 完整教程17--升级到EFCore2.0
原文:MVC5+EF6 完整教程17--升级到EFCore2.0 EF Core 2.0上周已经发布了,我们也升级到core 文章内容基于vs2017,请大家先安装好vs2017(15.3). 本篇文章主要讲下差异点,跟之前一样的就不再重复了。
1498 0
|
前端开发 .NET 开发框架
MVC 5 + EF6 完整教程16 -- 控制器详解
原文:MVC 5 + EF6 完整教程16 -- 控制器详解 Controller作为持久层和展现层的桥梁, 封装了应用程序的逻辑,是MVC中的核心组件之一。 本篇文章我们就来谈谈 Controller, 主要讨论两个方面: Controller运行机制简介 Controller数据传递方式...
1243 0
|
开发框架 前端开发 .NET
ASP.NET CORE 3.1 MVC“指定的网络名不再可用\企图在不存在的网络连接上进行操作”的问题解决过程
ASP.NET CORE 3.1 MVC“指定的网络名不再可用\企图在不存在的网络连接上进行操作”的问题解决过程
458 0
|
存储 开发框架 前端开发
[回馈]ASP.NET Core MVC开发实战之商城系统(五)
经过一段时间的准备,新的一期【ASP.NET Core MVC开发实战之商城系统】已经开始,在之前的文章中,讲解了商城系统的整体功能设计,页面布局设计,环境搭建,系统配置,及首页【商品类型,banner条,友情链接,降价促销,新品爆款】,商品列表页面,商品详情等功能的开发,今天继续讲解购物车功能开发,仅供学习分享使用,如有不足之处,还请指正。
358 0