EasyUI DataGrid 多表字段拼接顯示：SQL 層面組合數據的實戰技巧

需求場景

EasyUI DataGrid 需要展示來自多張表的組合字段（如表 A 的字段與表 B 的字段拼接），避免前端複雜邏輯。

解決方案：SQL 拼接

在數據庫查詢層直接完成字段拼接，返回給前端已組合好的字符串。

Oracle 示例

SELECT t1.b || '-' || t2.b AS combined_field
FROM (SELECT a, b FROM A WHERE d = 1) t1,
     (SELECT a, REPLACE(WM_CONCAT(c), ',', '-') AS b
      FROM A
      START WITH d = 1
      CONNECT BY b = PRIOR c
      GROUP BY a) t2
WHERE t1.a = t2.a;

• ||：Oracle 字符串拼接運算符。
• WM_CONCAT：聚合多行字符串（注意去重與排序）。
• REPLACE：將默認分隔符逗號替換為業務所需的連字符。

MySQL 示例

SELECT CONCAT(t1.field1, '-', t2.field2) AS combined
FROM table1 t1
JOIN table2 t2 ON t1.id = t2.id;

SQL Server 示例

SELECT t1.field1 + '-' + t2.field2 AS combined
FROM table1 t1
INNER JOIN table2 t2 ON t1.id = t2.id;

優勢

• 前端 DataGrid 只需綁定單一字段 combined_field。
• 減少前端模板渲染邏輯，降低耦合。
• 利用數據庫引擎優化連接與聚合性能。

注意

若拼接邏輯極其複雜或涉及非關係運算，可考慮視圖或存儲過程封裝。