分成两篇的原因是图片会比较多,有些人看着可能会有些烦。
接着,我们来讲讲 LearningController , 里面有这么一段代码(都是自动生成的)
<pre name="code" class="plain"> public ActionResult Index()
{
return View();
}
注意,这个Index()方法的返回值,return View(); View()里面是没有有参数的,因此它默认返回的是Index.cshtml
如果我们在Learning文件夹里再新建一个试图 ,命名为 Test
把LearningController 的Index()方法代码改成
public ActionResult Index()
{
return View("Test");
}
运行结果如下,注意我的路径,结果说明了调用的视图是Test.cshtml,这也就是说,以后我们可以通过Controller的某个动作函数对一些动作进行判断,然后再进行相对应的试图调用,比如登陆验证。
接下来要讲的是比较重要的,大家可能需要多看几遍,我尽量讲清楚。
不知道大家知道模板页的概念吗?不知道的话大家可以看一下CSDN的最顶部,然后多切换几个页面,最上面那一条是不是都是一样的,只有下面是变化的。是的,最上面这个就是模板页。
在MVC模式中,可以把最上面的那一条做好了,放在某个地方,等需要的时候再调用它。如果不能理解就想想我们平时写的子函数吧。哪里需要它就在哪里调用它。
接下来,请点开,View里面的shared文件夹,打开_Layout.cshtml,代码如下
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width" />
<title>@ViewBag.Title</title>
@Styles.Render("~/Content/css")
@Scripts.Render("~/bundles/modernizr")
</head>
<body>
@RenderBody()
@Scripts.Render("~/bundles/jquery")
@RenderSection("scripts", required: false)
</body>
</html>
@其紧跟的代码是C#代码,@是一个解析符,告诉VS它是C#语句,要把它解析成 浏览器能理解的语言(html,css,js等)
<title>@ViewBag.Title<title> 这个其实就是页面名,会动态解析
比如有一个子函数
void Display(int num)
{
printf("%d ",num);
}
每次num不一样,输出的值就不一样。
@Styles.Render("~/Content/css")
@Scripts.Render("~/bundles/modernizr")
<pre name="code" class="csharp">@Scripts.Render("~/bundles/jquery")
是加载进来相对应的文件,另注
:‘~’的意思是‘Global.asax’所在的文件夹路径
@RenderBody()
@ViewBag.Title
@RenderSection("scripts", required: false)
则是所调用的页面所用的参数,接下来我们来解释这个三个奇怪的生物。
首先是@ViewBag.Title , Index.cshtml的代码如下,
@{
ViewBag.Title = "Index";
}
<h2>Index</h2>
把ViewBag.Title = "Index";的值改一下,在运行一下,看看浏览器的标题是不是有变呢?知道了吧。别急着关掉,在浏览器的页面点击鼠标右键,查看源代码,是不是一个很完整的html页面。(这一次我没有截图也没改代码,就是希望大家能够自己动手一下)
接着我们再改一下代码
@{
ViewBag.Title = "Index"; Layout=null;
}
<h2>Index</h2>
运行一下,再看一下,发现只有<h2>Index<h2>,这根本不是一个完成的html页面,也没有title也不见了,也就是说如果你不想调用母版页,那么Layout=null; 就可以了,大家可以看下Shared 文件夹下的 error.cshtml ,它就没调用母版页
接着我们讲一下
@RenderBody()
改一下_Layout.cshtml的代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width" />
<title>@ViewBag.Title</title>
@Styles.Render("~/Content/css")
@Scripts.Render("~/bundles/modernizr")
</head>
<body>
<h1>AAAAAAAAAAA</h1>
@RenderBody()
<h1>BBBBBBBBBBB</h1>
@Scripts.Render("~/bundles/jquery")
@RenderSection("scripts", required: false)
</body>
</html>
运行一下,结果如下,能理解吗?
@RenderSection("scripts", required: false)
后面这个参数required:false的意思是,不一定需要"scripts"这个东西,它不是必须的
改一下_Layout.cshtml的代码,
并在Index.cshtml里加入
@section test
{
<h1>Look Here</h1>
}
运行结果
再次改_Layout.cshtml代码
希望对各位同学能够有所帮助。