diff --git a/docs/row-expand.md b/docs/row-expand.md index 1aa958a..5f6b47a 100644 --- a/docs/row-expand.md +++ b/docs/row-expand.md @@ -13,6 +13,7 @@ * [onExpand](#onExpand) * [onExpandAll](#onExpandAll) * [showExpandColumn](#showExpandColumn) +* [onlyOneExpanding](#onlyOneExpanding) * [expandColumnRenderer](#expandColumnRenderer) * [expandHeaderColumnRenderer](#expandHeaderColumnRenderer) @@ -127,3 +128,13 @@ const expandRow = { showExpandColumn: true }; ``` + +### expandRow.onlyOneExpanding - [Bool] +Default is `false`. Enable this will only allow one row get expand at the same time. + +```js +const expandRow = { + renderer: (row) => ... + onlyOneExpanding: true +}; +``` diff --git a/packages/react-bootstrap-table2-example/examples/row-expand/expand-only-one.js b/packages/react-bootstrap-table2-example/examples/row-expand/expand-only-one.js new file mode 100644 index 0000000..4ef5bc4 --- /dev/null +++ b/packages/react-bootstrap-table2-example/examples/row-expand/expand-only-one.js @@ -0,0 +1,73 @@ +import React from 'react'; + +import BootstrapTable from 'react-bootstrap-table-next'; +import Code from 'components/common/code-block'; +import { productsExpandRowsGenerator } from 'utils/common'; + +const products = productsExpandRowsGenerator(); + +const columns = [{ + dataField: 'id', + text: 'Product ID' +}, { + dataField: 'name', + text: 'Product Name' +}, { + dataField: 'price', + text: 'Product Price' +}]; + +const expandRow = { + onlyOneExpanding: true, + renderer: row => ( +
{ `This Expand row is belong to rowKey ${row.id}` }
+You can render anything here, also you can add additional data on every row object
+expandRow.renderer callback will pass the origin row object to you
+{ \`This Expand row is belong to rowKey $\{row.id}\` }
+You can render anything here, also you can add additional data on every row object
+expandRow.renderer callback will pass the origin row object to you
+{ sourceCode }
+