SearchPanes 布局
您可以为 SearchPanes 定义自己的布局。在您的页面上加入 SearchPanes 时,这允许进行更加定制的体验。
设置窗格的位置
通过利用 dom
特性,可以选择窗格相对于主数据表的显示位置。与 dom
特性搭配使用时,SearchPanes 会以 dom
特性中的 P
字符作为别名。建议的布局和 dom
初始化如下
{
dom: 'Pfrtip'
}
这将确保窗格置于数据表上方。如果您想让窗格显示在表格、分页和信息部分的下方,则需要初始化如下
{
dom: 'frtipP'
}
设置一行中窗格的数量
默认情况下,SearchPanes 将在完整的桌面显示器上以每行三个窗格的宽度显示窗格,内置一个响应式元素,以根据屏幕宽度来调整此宽度。如果您想覆盖此默认设置,可以定义 SearchPanes 容器中每行显示的窗格数量,如下所示
{
searchPanes: {
layout: `columns-2'
},
dom: 'Pfrtip'
}
上述初始化将允许窗格以每列 2 个窗格的宽度显示。共有 6 个受支持的选项 - 分别从 1 到 6。
垂直显示窗格
还可以通过如下操控 dom
特性,在数据表旁边垂直显示窗格
{
searchPanes:{
layout: 'columns-1'
},
dom: '<"dtsp-verticalContainer"<"dtsp-verticalPanes"P><"dtsp-dataTable"frtip>>'
}
这将在数据表的左侧显示窗格。