diff --git a/examples/docs/table.md b/examples/docs/table.md
index 2dd84edf1..4ec161fc2 100644
--- a/examples/docs/table.md
+++ b/examples/docs/table.md
@@ -865,3 +865,4 @@
| formatter | 用来格式化内容,在 formatter 执行的时候,会传入 row 和 column | function | — | — |
| show-tooltip-when-overflow | 当过长被隐藏时显示 tooltip | Boolean | — | false |
| inline-template | 指定该属性后可以自定义 column 模板,参考多选的时间列,通过 row 获取行信息,JSX 里通过 _self 获取当前上下文。此时不需要配置 property 属性 | — | — |
+| align | 对齐方式 | String | left, center, right | left |
diff --git a/packages/table/src/table-body.js b/packages/table/src/table-body.js
index 63e31f299..5092f47f2 100644
--- a/packages/table/src/table-body.js
+++ b/packages/table/src/table-body.js
@@ -52,7 +52,7 @@ export default {
this._l(this.columns, (column) =>
this.handleCellMouseEnter($event, row) }
on-mouseleave={ this.handleCellMouseLeave }>
{
diff --git a/packages/table/src/table-column.js b/packages/table/src/table-column.js
index a5504048f..86bb0dd60 100644
--- a/packages/table/src/table-column.js
+++ b/packages/table/src/table-column.js
@@ -83,6 +83,7 @@ export default {
type: Boolean,
default: true
},
+ align: String,
showTooltipWhenOverflow: {
type: Boolean,
default: false
@@ -160,6 +161,7 @@ export default {
minWidth,
width,
isColumnGroup,
+ align: this.align ? 'is-' + this.align : null,
realWidth: width || minWidth,
sortable: this.sortable,
resizable: this.resizable,
diff --git a/packages/table/src/table-header.js b/packages/table/src/table-header.js
index 755b4175a..9e67132a3 100644
--- a/packages/table/src/table-header.js
+++ b/packages/table/src/table-header.js
@@ -26,7 +26,7 @@ export default {
on-mouseout={ this.handleMouseOut }
on-mousedown={ ($event) => this.handleMouseDown($event, column) }
on-click={ ($event) => this.handleHeaderClick($event, column) }
- class={ [column.id, column.direction] }>
+ class={ [column.id, column.direction, column.align] }>
{
[
column.headerTemplate
diff --git a/packages/theme-default/src/table.css b/packages/theme-default/src/table.css
index 960bb393f..cb31cd622 100644
--- a/packages/theme-default/src/table.css
+++ b/packages/theme-default/src/table.css
@@ -62,6 +62,18 @@
vertical-align: middle;
position: relative;
border-bottom: 1px solid var(--table-border-color);
+
+ @when center {
+ text-align: center;
+ }
+
+ @when left {
+ text-align: left;
+ }
+
+ @when right {
+ text-align: right;
+ }
}
@modifier border {
|