如何将Kendo MVC Grid部分列定义移入视图中的辅助方法

我来帮你搞定这个问题！把Kendo MVC Grid的列定义拆分成视图内的辅助方法其实很简单，下面分两种最实用的方式给你演示：

方式一：视图内的@Helper方法（适合当前视图复用） #

如果只是在当前视图里拆分复杂的列定义，直接用Razor的@helper语法就可以。在你的.cshtml视图顶部（或者共享视图里）定义一个接收GridColumnFactory<MyModel>参数的helper：

@helper SharedDocumentColumns(GridColumnFactory<MyModel> columns)
{
    // 这里放你想抽离的通用列定义
    columns.Bound(m => m.Id).Hidden();
    columns.Bound(m => m.DocumentName).Title("Document Name").Width(200);
    columns.Bound(m => m.CreatedDate).Format("{0:yyyy-MM-dd}").Title("Created Date");
    columns.Bound(m => m.Status).Title("Status").ClientTemplate("#= StatusText #");
}

然后在你的Grid的Columns()方法里直接调用这个helper，再补充当前Grid特有的列：

@(Html.Kendo().Grid<MyModel>()
    .Name("documents")
    .Editable(e => e.Mode(GridEditMode.InLine))
    .AutoBind(false)
    .DataSource(b => b.Ajax()
        .Model(m => { m.Id(o => o.Id); })
        .Read(a => a.Action("documents", "document"))
    )
    .Columns(c => {
        // 调用视图内的共享列helper
        SharedDocumentColumns(c);
        
        // 添加当前Grid独有的列
        c.Command(cmd => {
            cmd.Edit().Text("Edit");
            cmd.Destroy().Text("Delete");
        }).Title("Actions").Width(150);
    })
)

方式二：静态扩展方法（适合多视图全局复用） #

如果你的通用列需要在多个视图里复用，更推荐创建静态扩展方法。在项目里新建一个静态类（比如放在Helpers文件夹下）：

using Kendo.Mvc.UI;

public static class GridColumnExtensions
{
    /// <summary>
    /// 添加文档Grid的通用列
    /// </summary>
    public static void AddDocumentCommonColumns(this GridColumnFactory<MyModel> columns)
    {
        columns.Bound(m => m.Id).Hidden();
        columns.Bound(m => m.DocumentName).Title("Document Name").Width(200);
        columns.Bound(m => m.CreatedDate).Format("{0:yyyy-MM-dd}").Title("Created Date");
        columns.Bound(m => m.Status).Title("Status").ClientTemplate("#= StatusText #");
    }
}

然后在视图里引用这个类的命名空间（比如@using YourProjectNamespace.Helpers），就可以在Grid里这样调用：

.Columns(c => {
    // 调用扩展方法添加通用列
    c.AddDocumentCommonColumns();
    
    // 补充特有列
    c.Command(cmd => { cmd.Edit(); cmd.Destroy(); }).Title("Actions");
})

关键原理说明 #

Kendo MVC Grid的Columns()方法接收一个Action<GridColumnFactory<T>>委托，本质上就是让你对GridColumnFactory<T>对象进行列配置操作。不管是视图内的helper还是扩展方法，都是直接操作这个对象，和你原来直接写c.Bound(...)的逻辑完全一致，只是把代码抽离了出来。

你还可以把不同职责的列拆成多个helper/扩展方法，比如把命令列、状态列、基础信息列分开，让Grid的代码结构更清晰。

内容的提问来源于stack exchange，提问作者Martin D.