运用Razor的@helper语法解决View逻辑代码重用的问题-QiuLiang's Blog

运用Razor的@helper语法解决View逻辑代码重用的问题

日期：2011-12-14 17:09:10作者：QiuLiang |

Razor作为ASP.NET MVC 3中最新加入的视图引擎，其简洁的语法和c#、HTML比较紧密的结合性，为我们的开发带来了流畅的体验，在Razor中有一个关键字@helper，可以解决View中代码逻辑重用的问题，以一个实例来说明：

场景

表格的表头需要支持排序（很常用的场景），表头的部分需要根据控制器呈现出不同的界面样式，如下：

1，默认的，超链接样式
2，点击一次之后，旁边出现一个向上的小三角，表示升序
3，再点击一次之后，变成向下的小三角，表示降序

原来的做法

根据控制器传递给前台的Model的OrderBy字段来进行逻辑判断，并输出相应的HTML片段

View前面的代码逻辑，用于处理相应的参数：

包含在View里面的HTML片段：

可以想象，如果有多个表头需要排序，或者其余页面也需要支持排序，这将是一个大量的重复性工作，当然，也可以采用ParialView的方式，今天主要介绍下helper关键字的实现方式：

Razor @helper实现方式

1，在App_Code目录下新建一个cshtml文件

2，使用@helper关键字定义扩展方法

在新增的cshtml文件里面添加代码如下：

@helper DisplaySort(string orderBy,string orderColName,string text,string id)
{    
    bool? isOrderBy = null;
    string orderName = string.Empty;
    if (!string.IsNullOrEmpty(orderBy)) {
        string[] arr = orderBy.Split(' ');
        if (arr.Length > 1) {
            orderName = arr[0];
            if (arr[1].ToLower() == "asc") {
                isOrderBy = true;   //true代表升序，false代表降序
            }
            else {
                isOrderBy = false;
            }
        }
    }
    //输出view
        
    "@(id)" class="t-link"
    @if(isOrderBy.HasValue) {   
        
        if (isOrderBy.Value && string.Equals(orderName, orderColName, StringComparison.CurrentCultureIgnoreCase))
        {
            @: orderby="@(orderColName)-desc"
        }
        else
        {
            @: orderby="@(orderColName)-asc"
        }

    }
    else
    {
        @: orderby="@(orderColName)-asc"
    } >
    @(text)
    @if (isOrderBy.HasValue && string.Equals(orderName, orderColName, StringComparison.CurrentCultureIgnoreCase)) {
        if (isOrderBy.Value ) {
            class="t-icon t-arrow-up">
        }
        else {
            class="t-icon t-arrow-down">
        }
    } 
    
    
    
}

3，在view里面调用：

<th rowspan="2" class="t-header customerfamily" scope="col">
     @SortColumn.DisplaySort(Model.OrderBy, "CustomerFamilyName", Resource.Lang.Message_Field_CustomerFamily, "abtnCfOrder")
th>

其中SortColumn类和App_Code目录下的cshtml文件名相同，并且支持智能感知。

参考：http://blogs.msdn.com/b/scottgu/archive/2011/05/23/asp-net-mvc-3-razor-helper.aspx

Tags: Razor helper asp.net mvc