当前位置: 移动技术网 > IT编程>开发语言>.net > asp.net core系列 41 Web 应用 MVC视图

asp.net core系列 41 Web 应用 MVC视图

2019年03月14日  | 移动技术网IT编程  | 我要评论

凌采露华官网,代嫁下堂妃,三鹿奶粉广告

一.mvc视图

  在web开发的mvc和razor中,都有使用视图,在razor中称为"页"。.cshtml视图是嵌入了razor标记的html模板。 razor 标记使用c#代码,用于与html 标记交互以生成发送给客户端的网页。在mvc目录结构中,views / [controllername] 文件夹下用于创建视图,其中views/shared 文件夹下的视图是控制器共享的视图。

  

  1.1  视图页razor 标记

    下面是views/home 文件夹中创建一个 about.cshtml 文件,呈现的视图如下:

@{
    viewdata["title"] = "about";
}
<h2>@viewdata["title"].</h2>
<h3>@viewdata["message"]</h3>

     razor 标记以 @ 符号开头。后面的大括号 { ... } 括住的是 razor 代码块,是运行 c# 语句。 只需用 @ 符号来引用值,即可在 html 中显示这些值。比如上面h2和h3标签。

 

  1.2 控制器指定视图

    通常以 viewresult 的形式从action返回结果到视图,这是一种 actionresult结果类型(web api中有讲到)。但通常不会这样做。 因为大多数控制器均继承自controller,因此只需使用 view 方法即可返回 viewresult。示例如下:

public iactionresult about()
{
    viewdata["message"] = "your application description page.";
    
    return view();
}

     view 方法有多个重载。 可选择指定:

    //要返回的显式视图
    return view("orders");
    //要传递给视图的模型(实体)对象
    return view(orders);
    //视图和模型
    return view("orders", orders);

 

  1.3 视图发现

    action返回一个视图时, 这个过程叫“视图发现”。默认的 return view(); 将返回与当前action方法同名的视图。搜索匹配的视图文件顺序规则如下:

        views/[controllername]/[viewname].cshtml
        views/shared/[viewname].cshtml

    当return view()时,首先在 views/[controllername] 文件夹中搜索该视图。 如果在此处找不到匹配的视图,则会在“shared”文件夹中搜索该视图。

    在返回视图时,可以提供视图文件路径。 如果使用绝对路径(“/”或“~/”开头),必须指定 .cshtml 扩展名:

      return view("views/home/about.cshtml");

    也可使用相对路径在不同目录中指定视图,而无需指定 .cshtml 扩展名:

       return view("../manage/index");

    可以用“./”前缀来指示当前的控制器特定目录:

       return view("./about");

 

  1.4 向视图传递数据

    可以使用多种方法将数据传递给视图。包括:(1)强类型数据:viewmodel。(2)弱类型数据viewdata (viewdataattribute)、viewbag。viewbag  razor 页中不可用。

    (1) 强类型数据 viewmodel

      在传递数据到视图中,最可靠的是使用强类型数据,因为编译时能检查并且有智能感知。在视图页中使用@model指令来指定模型(可以是实体或集合泛型实体)。如下所示,其中前端的webapplication1.viewmodels.address是实体类命令空间,通过后端返回view强类型映射:

@model webapplication1.viewmodels.address
<h2>contact</h2>
<address>
    @model.street<br>
    @model.city, @model.state @model.postalcode<br>
    <abbr title="phone">p:</abbr> 425.555.0100
</address>
public iactionresult contact()
{
    viewdata["message"] = "your contact page.";

    var viewmodel = new address()
    {
        name = "microsoft",
        street = "one microsoft way",
        city = "redmond",
        state = "wa",
        postalcode = "98052-6399"
    };

    //返回强类型
    return view(viewmodel);
}

   (2) 弱类型数据(viewdata、viewdata 属性和 viewbag)

    视图还可以访问弱类型(也称为松散类型)的数据集合。可以使用弱类型数据集合将少量数据传入及传出控制器和视图。viewdata 属性是弱类型对象的字典。viewbag 属性是 viewdata 的包装器,为基础 viewdata 集合提供动态属性。viewdata派生自 viewdatadictionary,viewbag派生自 dynamicviewdata。

    viewdata 和 viewbag 在运行时进行动态解析。 由于它们不提供编译时类型检查,因此使用这两者通常比使用 viewmodel 更容易出错。建议尽量减少或根本不使用 viewdata 和 viewbag

 

    viewdata介绍

      下面是一个viewdata存储对象,在视图上强制转换为特定类型(address)。

public iactionresult someaction()
{
    viewdata["greeting"] = "hello";
    viewdata["address"]  = new address()
    {
        name = "steve",
        street = "123 main st",
        city = "hudson",
        state = "oh",
        postalcode = "44236"
    };

    return view();
}
@{
    // since address isn't a string, it requires a cast.
    var address = viewdata["address"] as address;
}

@viewdata["greeting"] world!

<address>
    @address.name<br>
    @address.street<br>
    @address.city, @address.state @address.postalcode
</address>

   

    viewdata 特性介绍

      可以在控制器或 razor 页面模型上,使用 [viewdata] 修饰属性。下面是一个示例:

public class homecontroller : controller
{
    [viewdata]
    public string title { get; set; }

    public iactionresult about()
    {
        title = "about us";
        viewdata["message"] = "your application description page.";

        return view();
    }
}
//通过字典key取出
<title>@viewdata["title"] - webapplication</title>

     

    viewbag介绍

      viewbag 不需要强制转换,因此使用起来更加方便。下面示例如下:   

public iactionresult someaction()
{
   // greeting不需要先声明,address 也一样,因为是dynamic类型
    viewbag.greeting = "hello";
    viewbag.address  = new address()
    {
        name = "steve",
        street = "123 main st",
        city = "hudson",
        state = "oh",
        postalcode = "44236"
    };

    return view();
}
@viewbag.greeting world!

<address>
    @viewbag.address.name<br>
    @viewbag.address.street<br>
    @viewbag.address.city, @viewbag.address.state @viewbag.address.postalcode
</address>

   

    更多视图功能包括:标记帮助程序、服务注入视图,视图组件等

 

  参考文献

    asp.net core mvc 中的视图

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

相关文章:

验证码:
移动技术网