B/S端界面控件DevExtreme中文使用指南——基于HTML的组件自定义

组件的API

官方建议使用UI组件的API来自定义它，与CSS类不同，API很少被更改。如果发生更改，UI组件将用警告填充浏览器控制台，帮助开发人员修复代码。

每个UI组件都有一个在UI组件的API参考部分中描述的API，例如开发人员可以通过相应的属性指定UI组件的宽度。在下面的例子中，这个属性是为List UI组件设置的。

jQuery

JavaScript

$(function() {$("#listContainer").dxList({width: 600});});

ASP.NET MVC控件

Razor C#

@(Html.DevExtreme().List().Width(600))

如果页面包含同一个UI组件的多个实例，开发人员可以使用defaultOptions(rule) 方法在一个地方为所有这些组件指定默认配置，相同的方法允许开发者为不同的设备指定不同的默认配置。

此外，UI组件提供了可以用于更深入自定义的模板。

单个CSS类

由于DevExtreme组件包含标准的HTML元素（<div>, <td>, <tr>等），所以开发人员可以使用CSS来自定义它们。

文档中记录了许多类，但是在大多数情况下，开发人员需要检查HTML标记来确定和覆盖应用的CSS类。

可以像往常一样使用class属性将类添加到标记中的UI组件元素中，如果不可能更改标记，则使用UI组件的elementAttr属性来实现相同的目的。

注意：CSS内部结构可能在不同版本之间更改而不另行通知。考虑到这一点，我们建议在可能的情况下使用它们的API替代CSS来自定义UI组件。因为如果API发生了更改，开发人员将收到通知。

在自定义过程中，建议通过响应式设计模式查看UI组件页面再不同设备上的外观。

DevExpress技术交流群6：600715373      欢迎一起进群讨论