DevExpress DevExtreme.AspNet.Data 开源项目最佳实践教程

1. 项目介绍

DevExpress DevExtreme.AspNet.Data 是一个开源项目，它为 ASP.NET 应用程序提供了数据访问和处理的强大功能。该项目是 DevExtreme 数据控件的一部分，旨在简化数据绑定的复杂性，支持各种后端技术和数据库的集成。它允许开发者轻松实现数据分页、排序、筛选、插入、更新和删除操作，无需编写大量重复的代码。

2. 项目快速启动

环境准备

• 安装.NET Core SDK
• 安装Visual Studio或Visual Studio Code

创建项目

1. 打开命令提示符或终端。
2. 使用以下命令创建一个新的 ASP.NET Core Web 应用程序：

dotnet new webapp -n DevExtremeExample

3. 切换到创建的项目目录：

cd DevExtremeExample

4. 安装 DevExtreme.AspNet.Data NuGet 包：

dotnet add package DevExpress.DevExtreme.AspNet.Data

配置数据源

1. 在 Startup.cs 文件中配置服务和中间件。

public void ConfigureServices(IServiceCollection services)
{
    services.AddControllers();

    // 添加 DevExtreme 数据服务
    services.AddDevExpressDevExtremeData();
}

public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
{
    // 配置应用程序的路由和中间件
    app.UseRouting();
    app.UseEndpoints(endpoints =>
    {
        endpoints.MapControllers();
    });
}

创建数据控制器

1. 创建一个新的控制器，例如 DataController。

using Microsoft.AspNetCore.Mvc;
using DevExpress.DevExtreme.AspNet.Data;
using System.Threading.Tasks;
using DevExpress.Data.Linq;

[ApiController]
[Route("api/[controller]")]
public class DataController : ControllerBase
{
    private readonly NorthwindContext _context;

    public DataController(NorthwindContext context)
    {
        _context = context;
    }

    [HttpGet]
    public async Task<IActionResult> Get()
    {
        var dataSource = DataSourceLoader.Load(_context.Products);
        return Ok(dataSource);
    }
}

3. 应用案例和最佳实践

数据绑定

在 ASP.NET Core 应用程序中，你可以通过 DevExtreme 数据控件（如 dxGrid）将数据绑定到控制器动作。

<dx-html-form>
    <dx-data-grid
        id="grid"
        dataSource="api/data"
        key="ProductID"
        showBorders="true">
        <!-- 列和操作配置 -->
    </dx-data-grid>
</dx-html-form>

数据操作

DevExtreme.AspNet.Data 支持数据操作（如插入、更新、删除），以下是如何在控制器中实现这些操作的示例。

[HttpPost]
public async Task<IActionResult> Post([FromBody] Product product)
{
    _context.Products.Add(product);
    await _context.SaveChangesAsync();
    return Ok(product);
}

[HttpPut]
public async Task<IActionResult> Put([FromBody] Product product)
{
    _context.Products.Update(product);
    await _context.SaveChangesAsync();
    return Ok(product);
}

[HttpDelete("{id}")]
public async Task<IActionResult> Delete(int id)
{
    var product = _context.Products.Find(id);
    if (product == null)
    {
        return NotFound();
    }
    _context.Products.Remove(product);
    await _context.SaveChangesAsync();
    return Ok(product);
}

4. 典型生态项目

在 DevExtreme 生态系统中，有许多项目可以与 DevExtreme.AspNet.Data 集成，例如：

• DevExtreme UI 控件，如 dxGrid、dxChart、dxScheduler 等，用于前端数据展示。
• DevExtreme Bootstrap 集成，用于创建响应式布局。
• DevExtreme Vue、React、Angular 集成，用于与现代前端框架的无缝协作。

通过使用这些项目，开发者可以构建功能丰富、响应迅速的 web 应用程序。