diff --git a/docs/table/index.en-us.md b/docs/table/index.en-us.md index 4bc2fc4a8d..98e0ed6ace 100644 --- a/docs/table/index.en-us.md +++ b/docs/table/index.en-us.md @@ -135,6 +135,7 @@ ReactDOM.render( | alignHeader | alignment of header cell, value of align by default

**options**:
'left', 'center', 'right' | Enum | - | | filters | generates a title filter menu in the format `[{label:'xxx', value:'xxx'}]` | Array<Object> | - | | filterMode | whether the filtering mode is single or multiple selection

**options**:
'single', 'multiple' | Enum | 'multiple' | +| filterProps | the props passed to Menu in filter mode, extend `Menu`'s API

**options**:
_subMenuSelectable_: {Boolean} default `false` subMenu can be selected or not
_isSelectIconRight_: {Boolean} default `false` select icon in right or not. (icon on SubMenu always in left) | Object | { subMenuSelectable: false } | | lock | whether the lock column is supported, the options are `left`, `right`, `true` | Boolean/String | - | | resizable | whether to support column resizing, when this value is set to true, the layout of the table will be modified to fixed | Boolean | false | diff --git a/docs/table/index.md b/docs/table/index.md index 898e52f28d..729ec79d5c 100644 --- a/docs/table/index.md +++ b/docs/table/index.md @@ -136,19 +136,20 @@ ReactDOM.render( ### Table.Column -| 参数 | 说明 | 类型 | 默认值 | -| ----------- | --------------------------------------------------------------------------------------------------- | ------------------------------- | -------------- | -| dataIndex | 指定列对应的字段，支持`a.b`形式的快速取值 | String | - | -| cell | 行渲染的逻辑
value, rowIndex, record, context四个属性只可读不可被更改
Function(value, index, record) => Element | ReactElement/ReactNode/Function | value => value | -| title | 表头显示的内容
value, rowIndex, record, context四个属性只可读不可被更改 | ReactElement/ReactNode/Function | - | -| sortable | 是否支持排序 | Boolean | - | -| width | 列宽，注意在锁列的情况下一定需要配置宽度 | Number/String | - | -| align | 单元格的对齐方式

**可选值**:
'left', 'center', 'right' | Enum | - | -| alignHeader | 单元格标题的对齐方式, 不配置默认读取align值

**可选值**:
'left', 'center', 'right' | Enum | - | -| filters | 生成标题过滤的菜单, 格式为`[{label:'xxx', value:'xxx'}]` | Array<Object> | - | -| filterMode | 过滤的模式是单选还是多选

**可选值**:
'single', 'multiple' | Enum | 'multiple' | -| lock | 是否支持锁列,可选值为`left`,`right`, `true` | Boolean/String | - | -| resizable | 是否支持列宽调整, 当该值设为true，table的布局方式会修改为fixed. | Boolean | false | +| 参数 | 说明 | 类型 | 默认值 | +| ----------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------- | -------------------------------- | +| dataIndex | 指定列对应的字段，支持`a.b`形式的快速取值 | String | - | +| cell | 行渲染的逻辑
value, rowIndex, record, context四个属性只可读不可被更改
Function(value, index, record) => Element | ReactElement/ReactNode/Function | value => value | +| title | 表头显示的内容
value, rowIndex, record, context四个属性只可读不可被更改 | ReactElement/ReactNode/Function | - | +| sortable | 是否支持排序 | Boolean | - | +| width | 列宽，注意在锁列的情况下一定需要配置宽度 | Number/String | - | +| align | 单元格的对齐方式

**可选值**:
'left', 'center', 'right' | Enum | - | +| alignHeader | 单元格标题的对齐方式, 不配置默认读取align值

**可选值**:
'left', 'center', 'right' | Enum | - | +| filters | 生成标题过滤的菜单, 格式为`[{label:'xxx', value:'xxx'}]` | Array<Object> | - | +| filterMode | 过滤的模式是单选还是多选

**可选值**:
'single', 'multiple' | Enum | 'multiple' | +| filterProps | filter 模式下传递给 Menu 菜单的属性， 默认继承 `Menu` 组件的API

**属性**:
_subMenuSelectable_: {Boolean} 默认为`false` subMenu是否可选择
_isSelectIconRight_: {Boolean} 默认为`false` 是否将选中图标居右。注意：SubMenu 上的选中图标一直居左，不受此API控制 | Object | { subMenuSelectable: false } | +| lock | 是否支持锁列,可选值为`left`,`right`, `true` | Boolean/String | - | +| resizable | 是否支持列宽调整, 当该值设为true，table的布局方式会修改为fixed. | Boolean | false | ### Table.ColumnGroup diff --git a/src/table/base/cell.jsx b/src/table/base/cell.jsx index fb690b1b16..8db9af6ef9 100644 --- a/src/table/base/cell.jsx +++ b/src/table/base/cell.jsx @@ -27,6 +27,7 @@ export default class Cell extends React.Component { style: PropTypes.object, innerStyle: PropTypes.object, filterMode: PropTypes.oneOf(['single', 'multiple']), + filterMenuProps: PropTypes.object, filters: PropTypes.array, sortable: PropTypes.bool, lock: PropTypes.any, @@ -72,6 +73,7 @@ export default class Cell extends React.Component { primaryKey, __normalized, filterMode, + filterMenuProps, filters, sortable, lock, diff --git a/src/table/base/filter.jsx b/src/table/base/filter.jsx index 173958e44d..28d76fe19b 100644 --- a/src/table/base/filter.jsx +++ b/src/table/base/filter.jsx @@ -13,6 +13,7 @@ export default class Filter extends React.Component { filters: PropTypes.array, filterMode: PropTypes.string, filterParams: PropTypes.object, + filterMenuProps: PropTypes.object, locale: PropTypes.object, onFilter: PropTypes.func, prefix: PropTypes.string, @@ -117,8 +118,16 @@ export default class Filter extends React.Component { }; render() { - const { filters, prefix, locale, filterMode, rtl } = this.props; + const { + filters, + prefix, + locale, + filterMode, + filterMenuProps, + rtl, + } = this.props; const { visible, selectedKeys } = this.state; + const { subMenuSelectable, ...others } = filterMenuProps; function renderMenuItem(item) { return {item.label}; @@ -129,7 +138,7 @@ export default class Filter extends React.Component { {renderMenuContent(children)} @@ -182,6 +191,7 @@ export default class Filter extends React.Component { selectedKeys={selectedKeys} selectMode={filterMode} onSelect={this.onFilterSelect} + {...others} > {content} diff --git a/src/table/base/header.jsx b/src/table/base/header.jsx index 6406b2c739..0bcc21fe88 100644 --- a/src/table/base/header.jsx +++ b/src/table/base/header.jsx @@ -87,6 +87,7 @@ export default class Header extends React.Component { dataIndex, filters, filterMode, + filterMenuProps, width, align, alignHeader, @@ -142,6 +143,7 @@ export default class Header extends React.Component { rtl={rtl} filterParams={filterParams} filterMode={filterMode} + filterMenuProps={filterMenuProps} onFilter={onFilter} /> ) : null; diff --git a/src/table/column.jsx b/src/table/column.jsx index e8181fe817..258a5ad795 100644 --- a/src/table/column.jsx +++ b/src/table/column.jsx @@ -59,6 +59,12 @@ export default class Column extends React.Component { * 过滤的模式是单选还是多选 */ filterMode: PropTypes.oneOf(['single', 'multiple']), + /** + * filter 模式下传递给 Menu 菜单的属性， 默认继承 `Menu` 组件的API + * @property {Boolean} subMenuSelectable 默认为`false` subMenu是否可选择 + * @property {Boolean} isSelectIconRight 默认为`false` 是否将选中图标居右。注意：SubMenu 上的选中图标一直居左，不受此API控制 + */ + filterMenuProps: PropTypes.object, /** * 是否支持锁列,可选值为`left`,`right`, `true` */ @@ -76,6 +82,9 @@ export default class Column extends React.Component { static defaultProps = { cell: value => value, filterMode: 'multiple', + filterMenuProps: { + subMenuSelectable: false, + }, resizable: false, };