1.什么是局部视图

  局部视图是在其他视图中呈现的视图。通过执行局部视图生成的HTML输出呈现在调用视图中。与视图一样,局部视图使用 .cshtml 文件扩展名。当希望在不同视图之间共享网页的可重用部分时,就可以使用局部视图。

2.什么时候使用局部视图

  局部视图是将大视图分成小组件的有效方法。通用的布局元素应在 _Layout.cshtml 中指定,非布局可重用内容可以封装成局部视图。

  如果一个由几个逻辑部分组成的复杂页面,那么将每个逻辑部分作为局部视图是很有用。布局视图与普通视图之间没有语义差别,它们只是以不同的方式呈现。你可以直接从控制器的 ViewResult 返回视图,而这个视图也可以当局部视图来用。视图和局部视图的主要区别是呈现方式不同,局部视图不运行 _ViewStart.cshtml,而视图运行。

3.引用局部视图

  在视图页面中有几种方法呈现局部视图。最简单的是使用 Html.Partial ,它通过 @ 前缀来调用并返回 IHtmlString : @Html.Partial("AuthorPartial")。

  PartialAsync 方法对包含异步代码的局部视图是可用的: @await Html.PartialAsync("AuthorPartial") 。

  还可以使用 RenderPartial 方法来呈现局部视图。这个方法不返回结果:它将渲染结果直接输出到响应中。正因为它不返回响应,所以必须在 Razor 代码块中调用。通用也有一个异步方法 RenderPartialAsync:

@{
Html.RenderPartial("AuthorPartial");
}

4.发现局部视图

  当引用局部视图时,可以通过多种方式找到它的位置:

//以视图名使用当前文件夹下的视图,如果没有找到,则搜索Shared 文件夹
@Html.Partial("ViewName") //这个名称的视图必须在相同文件夹下
@Html.Partial("ViewName.cshtml") //依据应用根路径定位视图,以“/” 或 “~/” 开头的路径表示应用根路径
@Html.Partial("~/Views/Folder/ViewName.cshtml") //使用相对路径
@Html.Partial("../Account/ViewName.cshtml")

  局部视图可以链接。也就是说,一个局部视图可以调用另一个局部视图(只要不创建循环)。

5.局部视图访问数据

  当局部视图被实例化时,它获取父视图的 ViewData 字典的副本。对局部视图中的数据所做的更新不会影响到父视图。局部视图返回时,局部视图中更改的 ViewData 将丢失。

  你可以将 ViewDataDictionary 的实例传递到局部视图: @Html.Partial("PartialName",customViewData) 。

  也可以将模型传递到局部视图:@Html.Partial("PartialName",viewModel) 。

  也可以将ViewDataDictionary 和 模型都传递到视图:@Html.Partial("PartialName",viewModel,customViewData) 。

6.简单实战

  先创建用到的模型:

namespace MVCTest.Models
{
public class Article
{

      public Article()
      {
        Sections = new List<ArticleSection>();
      }

public string AuthorName { get; set; }
public List<ArticleSection> Sections { get; set; }
} public class ArticleSection
{
public string Title { get; set; }
public string Content { get; set; }
}
}

  然后在控制器中实例化模型:

    public class ArticleController : Controller
{
// GET: Article
public ActionResult Index()
{
var article = new Article();
article.AuthorName = "test";
article.Sections.Add(new ArticleSection() { Title="title",Content="content"});
return View(article);
} }

  父视图:

@model MVCTest.Models.Article

@{
ViewData["Title"] = "Index";
} <h2>@Model.AuthorName</h2>
@Html.Partial("AuthorPartial",Model.AuthorName); @foreach (var section in @Model.Sections)
{
@Html.Partial("ArticleSection", section);
}

  AuthorPartial.cshtml:

@model string

<h3>@Model</h3>

  ArticleSection.cshtml:

@model MVCTest.Models.ArticleSection

<h3>@Model.Title</h3>
<h2>@Model.Content</h2>

ASP.NET Core MVC 之局部视图(Partial Views)的更多相关文章

  1. ASP.NET Core MVC 之视图(Views)

    ASP.NET Core MVC 控制器可以使用视图返回格式化的结果. 1.什么是视图 在 MVC 中,视图封装了用户与应用交互呈现细节.视图是具有生成要发送到客户端内容的,包含嵌入代码的HTML模板 ...

  2. ASP.NET Core MVC 2.x 全面教程_ASP.NET Core MVC 12. Views 下

    ASP.NET Core MVC 13. 安装前端库 Partial VIew 就是部分View,他没有自己的数据,数据来自图中白色的那块,它的数据需要传进去,第一个参数是View的名称,第二个参数就 ...

  3. ASP.NET Core MVC 视图

    ASP.NET Core MVC中视图的知识和ASP.NET MVC有很多相似之处,学习难度较低.以下内容主要体现了编程中模块化的思想,模块化才应是我们关注的重点. Layout 布局用于提供各个页面 ...

  4. ASP.NET Core MVC 之布局(Layout)

    1.什么是布局 布局通常包含常见的用户界面元素,例如应用头,导航或菜单元素和页脚,如图: 常见的HTML结构(例如脚本和样式表)也经常被应用程序中许多页面使用.所有这些共享元素都可以在布局中定义,然后 ...

  5. Working with Data » 使用Visual Studio开发ASP.NET Core MVC and Entity Framework Core初学者教程

    原文地址:https://docs.asp.net/en/latest/data/ef-mvc/intro.html The Contoso University sample web applica ...

  6. 使用ASP.NET Core MVC 和 Entity Framework Core 开发一个CRUD(增删改查)的应用程序

    使用ASP.NET Core MVC 和 Entity Framework Core 开发一个CRUD(增删改查)的应用程序 不定时更新翻译系列,此系列更新毫无时间规律,文笔菜翻译菜求各位看官老爷们轻 ...

  7. ASP.NET Core 入门教程 7、ASP.NET Core MVC 分部视图入门

    一.前言 1.本教程主要内容 ASP.NET Core MVC (Razor)分部视图简介 ASP.NET Core MVC (Razor)分部视图基础教程 ASP.NET Core MVC (Raz ...

  8. 观看杨老师(杨旭)Asp.Net Core MVC入门教程记录

    观看杨老师(杨旭)Asp.Net Core MVC入门教程记录 ASP.NET Core MVC入门 Asp.Net Core启动和配置 Program类,Main方法 Startup类 依赖注入,I ...

  9. ASP.NET Core MVC 之视图组件(View Component)

    1.视图组件介绍 视图组件是 ASP.NET Core MVC 的新特性,类似于局部视图,但它更强大.视图组件不使用模型绑定,并且仅依赖于调用它时所提供的数据. 视图组件特点: 呈块状,而不是整个响应 ...

随机推荐

  1. 针对Linux 文件完整性监控的实现

    针对Linux 文件完整性监控的实现 摘要 计算机和互联网是20世纪以来最伟大的发明之一,随着计算机技术的不断发展,人们的生活方式发生了巨大的变化.计算机和互联网的发展给人们的生产生活带来了极大的便利 ...

  2. 【需要重新整理】【mongoDB】mongoDB初见笔记

    A安装(windows版): 1.官网下载安装文件 2.解压 3.配置环境变量 4.win+r cmd>打开控制台配置仓库路径 5.mongod --dbpath=d:/bigMongo//启动 ...

  3. Android之LinearLayout布局下怎么让按钮固定在底部

    <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android=&quo ...

  4. 网络学习笔记(三):HTTP缓存

      HTTP缓存是一种保存资源副本并在下次请求时直接使用该副本的技术,合理的使用缓存可以有效的提升web性能.   浏览器将js文件.css文件.图片等资源缓存,当下次请求这些资源时,可以不发送网络请 ...

  5. PATA 1027 Colors In Mars

    #include <cstdio> char radix[13] = {'0','1','2','3','4','5','6','7','8','9','A','B','C'}; int ...

  6. SHELL 中条件语句的运用 if for 条件测试语句

    if条件测试语句可以让脚本根据实际情况自动执行相应的命令.从技术角度来讲,if语句分为单分支结构.双分支结构.多分支结构:其复杂度随着灵活度一起逐级上升. if条件语句的单分支结构由if.then.f ...

  7. leetcode的Hot100系列--136. 只出现一次的数字

    因为之前刚写了461号题目,这个题目与那个很相似, 461号题目用异或来算两个不一样的部分, 那这个题目需要排除一样的部分,并找到不一样的部分. 那么可以再利用一下异或的特性: 1.相同为0,所以,a ...

  8. solidity智能合约如何判断地址为0或空

    智能合约地址判断 在旧版本中可使用以下代码来进行比较: owner != 0x0 但如果在新版本中使用,则会提示错误信息. 那么,如何正确使用来比较地址是否为空呢. 解决方案 可以使用address( ...

  9. nginx实战操作(常用命令及配置)

    1. nginx介绍 2. nginx常用命令 验证配置是否正确: nginx -t 查看Nginx的详细的版本号:nginx -V 查看Nginx的简洁版本号:nginx -v 启动Nginx:st ...

  10. 拓扑排序 (Topological Sorting)

    拓扑排序(Topological Sorting) 一.拓扑排序 含义 构造AOV网络全部顶点的拓扑有序序列的运算称为拓扑排序(Topological Sorting). 在图论中,拓扑排序(Topo ...