当前位置: 移动技术网 > IT编程>开发语言>.net > ASP.Net MVC 布局页、模板页使用方法详细介绍

ASP.Net MVC 布局页、模板页使用方法详细介绍

2017年12月08日  | 移动技术网IT编程  | 我要评论

猎场58集下载,哈金杰,中餐速成第二季

一、views文件夹 -> shared文件夹下的 _layout.cshtml 母版页

@renderbody

当创建基于_layout.cshtml布局页面的视图时,视图的内容会和布局页面合并,而新创建视图的内容会通过_layout.cshtml布局页面的@renderbody()方法呈现在标签之间。

@renderpage
从名称可以猜出来这个方法是要呈现一个页面。比如网页中固定的头部可以单独放在一个共享的视图文件中,然后在布局页面中通过这个方法调用,用法如下:
@renderpage(“~/views/shared/_header.cshtml”)
带参数
@renderpage(“~/views/shared/_header.cshtml”,new{parm="my",parm2="you")
调用页面获取参数:
//获取 renderpage() 传递过来的参数
@pagedata["param"]

@rendersection

布局页面还有节(section)的概念,也就是说,如果某个视图模板中定义了一个节,那么可以把它单独呈现出来
为了防止因缺少节而出现异常,可以给rendersection()提供第2个参数:
@rendersection("head", false)

@if (issectiondefined("head"))
        {
            @rendersection("head", false)
        }
        else
        {
            <p>submenu section is not defined!</p>
        }

 代码如下:

<!doctype html> 
<html> 
<head> 
  <title>@viewbag.title</title> 
  <link href="@url.content(" rel="external nofollow" ~/content/site.css")" rel="stylesheet" type="text/css" /> 
  <script src="@url.content("~/scripts/jquery-1.4.4.min.js")" type="text/javascript"></script> 
  @rendersection("head", required: true)@*view页面自定义特定js/css使用*@ 
</head> 
 
<body> 
  @renderpage("~/views/shared/_header.cshtml") 
  @renderbody() 
</body> 
</html> 

二、创建视图,使用母版页

代码如下:

@{ 
  viewbag.title = "index"; 
  layout = "~/views/shared/_layout.cshtml"; 
} 
<h2>index</h2> 
@section head{ 
  <script type="text/javascript"> 
    $(function () { 
      alert("hello jquery"); 
    }); 
  </script> 
} 
<p>执行c#普通语法</p><br /> 
@datetime.now.date.toshortdatestring() 
 
<p>执行c#语句段</p> 
@{ 
  list<string> list = new list<string> { "mvc3", "razor" }; 
  list.add(".net4");   
} 
<ul> 
@foreach(string s in list) 
{ 
  if (string.isnullorempty(s)) 
  { 
    <li>空</li> 
  } 
  else 
  {  
    <li>@s</li> 
  } 
} 
</ul> 

三、生成页面的源代码

<!doctype html>
<html>
<head>
  <title>index</title>
  <link href="/content/site.css" rel="external nofollow" rel="stylesheet" type="text/css" />
  <script src="/scripts/jquery-1.4.4.min.js" type="text/javascript"></script>
  
  <script type="text/javascript">
    $(function () {
      alert("hello jquery");
    });
  </script>

</head>

<body>
  <h2>index</h2>

<p>执行c#普通语法</p><br />
2013/3/11

<p>执行c#语句段</p>
<ul>
    <li>mvc3</li>
    <li>razor</li>
    <li>.net4</li>
</ul>

 

</body>
</html>

四、@html.partial

partial 每次都会创建自己的 textwriter 实例并且把内容缓存在内存中. 最后把所有 writer输出的内容发送到一个 mvcstring对象中
更多时候我们会使用 @{ html.renderpartial("details"); } 而不是@html.partial

html.renderpartial()与@html.partial的区别

html.renderpartial 直接输出至当前 httpcontext(因为是直接输出,所以性能好)。

html.partial 将视图内容直接生成一个字符串并返回(相当于有个转义的过程)。

renderpage()和renderpartial()的区别

renderpage()调用的页面只能使用其传递过去的数据。
而renderpartial()是可以使用viewdata,model等数据的。

如:@{html.renderpartial("basicchart",model);}
  用这个重载可以在部分视图里使用强类型,然后在主视图中使用第二个参数传model过去

@{html.renderpartial("basicchart",viewdata["mydata"]);}

html.renderpartial和html.renderaction的区别

html.renderpartial适合用在重覆使用的usercontrol,并且只需要透过model来呈现内容,或是对于广告的usercontrol也适合使用。


html.renderaction则会先去呼叫controller的action方法,如果此usercontrol是需要透过资料库取得资料来呈现(透过action来读取资料库),此时会比较适合使用此方式。

补充:

1、带有render的方法返回值是void,在方法内部进行输出;不带的返回值类型为mvchtmlstring,所以只能这样使用:
@html.partial 对应 @{html.renderpartial(....);}
@html.action 对应 @{html.renderaction(....);}

2、html.partial可以直接提供用户控件名作为参数,而html.action需要有对应的action,在action内部返回partailresult(即retun partialview())。

3、对于简单的没有任何逻辑的用户控件,推荐使用html.partial;对于需要设置一些model的用户控件,推荐使用html.action。当然,有model数据也是可以使用html.partial方法的,可以看方法的重载。

4、使用html.action有个好处,就是可以根据不同的场景选择不同的用户控件。

比如:
@html.action("userinfocontrol")
在对应的userinfocontrol这个action中,在用户未登录的时候,可以retun partialview("logonusercontrol");登录后,可以retun partialview("userinfocontrol");

如对本文有疑问,请在下面进行留言讨论,广大热心网友会与你互动!! 点击进行留言回复

相关文章:

验证码:
移动技术网