Table Group By v2

Bootstrap Table 的數據分組擴展，允許按指定字段對表格數據進行分組展示。

用法

<link rel="stylesheet" href="extensions/group-by-v2/bootstrap-table-group-by.css">
<script src="extensions/group-by-v2/bootstrap-table-group-by.js"></script>

示例

Group By v2

選項

groupBy

• 屬性: data-group-by

• 類型: Boolean

• 詳情:

  控制是否啟用數據分組功能。設置為 true 時，表格數據將按指定字段分組展示。

• 默認值: false

groupByField

• 屬性: data-group-by-field

• 類型: String|Array

• 詳情:

  設置用於分組的字段：

  • 單字段時使用字符串，例如 shape。
  • 多字段時使用數組，例如 ['shape', 'color']。

• 默認值: ''

groupByFormatter

• 屬性: data-group-by-formatter

• 類型: Function

• 詳情:

  分組行的格式化函數，入參：

  • value：分組值。
  • idx：分組索引。
  • data：該分組內的行數組。

• 默認值: undefined

groupByToggle

• 屬性: data-group-by-toggle

• 類型: Boolean

• 詳情:

  設為 true 時允許折疊/展開分組。

• 默認值: false

groupByShowToggleIcon

• 屬性: data-group-by-show-toggle-icon

• 類型: Boolean

• 詳情:

  設為 true 時根據折疊狀態顯示切換圖標（需與 groupByToggle 配合）。

• 默認值: false

groupByCollapsedGroups

• 屬性: data-group-by-collapsed-groups

• 類型: Array|Function

• 詳情:

  列表中的分組鍵將默認折疊。該選項可以是：

  • 變量（數組）
  • 數組字符串，例如 ['circle']
  • 返回數組的函數，入參為：
    • 分組鍵
    • 分組中的數據

• 默認值: []