71muke?v=1
在线看书
立即购买

第一章 ASP.NET MVC介绍

收起
2023-04-08更新,每天更一篇

第二章 视图和控制器的数据交互

收起
2023-04-08更新,每天更一篇

第三章 模型绑定的使用

收起
2023-04-08更新,每天更一篇

第四章 ASP.NET MVC中的表单辅助方法

收起
2023-04-08更新,每天更一篇

第五章 ASP.NET MVC的表单验证

收起
2023-04-08更新,每天更一篇

第六章 ASP.NET中的强类型

收起
2023-04-08更新,每天更一篇

第七章 ASP.NET MVC中使用Ajax

收起
2023-04-08更新,每天更一篇

第八章 在ASP.NET MVC中WebAPI的使用

收起
2023-04-08更新,每天更一篇

第九章 控制器和路由的使用

收起
2023-04-08更新,每天更一篇

第十章 用户管理的实战开发

收起
2023-04-08更新,每天更一篇

视图的创建和使用

上节课我们学习了控制器的创建,但是创建完成后,运行时又报错了,为什么呢?

就是因为我们没有创建控制器方法对应的视图页面!!


什么是视图页面?我们带着疑问进入到今天的学习。


视图的创建

我们在Views文件夹下会发现对应控制器,多了一个文件夹“Login”。

image.png

按要求,我们对Login文件夹右键添加一个视图给它。操作如下:

添加前需要先暂停程序运行!!

image.png

步骤一:接着看到下面的操作

image.png

步骤二:按下图操作

视图名称,一定要跟你的方法名对上!!

image.png

布局页说明(后面再重点讲):

在Views/Shared/_Layout.cshtml就是一个布局页。理解就是视图页面可以嵌套共同的导航页脚代码进去使用。

_Layout.cshtml

该文件默认位置:/Views/Shared/_Layout.cshtml

_Layout.cshtml通常称为“布局页”、“母版视图”、“模板页”

_Layout.cshtml有两段特别的Razor声明

RenderBody:“body占位符”的作用。子视图页面的所有内容默认填入到_Layout.cshtml的@RenderBody所在位置

RenderSection:作用是“块占位符”。将子页面中定义的代码块填入到_Layout.cshtml的@ RenderSection所在位置


具体可以在课程中观看本课程的视频教学讲解。


步骤三:在视图中添加如下代码(记得写完代码,按ctrl+s保存

image.png


步骤四:运行项目,再在浏览器地址中查看结果。

image.png

访问地址:https://localhost:44368/Login/Index

image.png

可能你有疑问,为什么会显示有导航和页脚。我们虽然没有配置布局页。但是在这里默认给我们配置了。

image.png

如果不需要默认布局页,有以下两种办法:

1、直接修改下面的文件为空(这样就是全部页面都没有默认布局页):

image.png

效果如下图:

image.png

对应的页面也会出现这种情况:

image.png

2、也可以单独对某个不需要布局页的页面改成下面这样,效果一样。这种情况是针对单个视图效果不生效修改!!

image.png


效果:

image.png

image.png


学习完视图了,快来做作业吧!!

作业:给AdminController.cs下的Test方法,创建对应的Test视图页面。

留言

发布留言

需要购买本课才能留言哦~

{{ item.createtime | dateStr }}