mirror of
https://github.com/gosticks/react-bootstrap-table2.git
synced 2025-10-16 11:55:39 +00:00
58 lines
1.0 KiB
JavaScript
58 lines
1.0 KiB
JavaScript
import React from 'react';
|
|
|
|
import BootstrapTable from 'react-bootstrap-table-next';
|
|
import Code from 'components/common/code-block';
|
|
import { productsGenerator } from 'utils/common';
|
|
|
|
const products = productsGenerator();
|
|
|
|
const columns = [{
|
|
dataField: 'id',
|
|
text: 'Product ID'
|
|
}, {
|
|
dataField: 'name',
|
|
text: 'Product Name'
|
|
}, {
|
|
dataField: 'price',
|
|
text: 'Product Price'
|
|
}];
|
|
|
|
const selectRow = {
|
|
mode: 'checkbox',
|
|
clickToSelect: true
|
|
};
|
|
|
|
const sourceCode = `\
|
|
import BootstrapTable from 'react-bootstrap-table-next';
|
|
|
|
const columns = [{
|
|
dataField: 'id',
|
|
text: 'Product ID'
|
|
}, {
|
|
dataField: 'name',
|
|
text: 'Product Name'
|
|
}, {
|
|
dataField: 'price',
|
|
text: 'Product Price'
|
|
}];
|
|
|
|
const selectRow = {
|
|
mode: 'checkbox',
|
|
clickToSelect: true
|
|
};
|
|
|
|
<BootstrapTable
|
|
keyField='id'
|
|
data={ products }
|
|
columns={ columns }
|
|
selectRow={ selectRow }
|
|
/>
|
|
`;
|
|
|
|
export default () => (
|
|
<div>
|
|
<BootstrapTable keyField="id" data={ products } columns={ columns } selectRow={ selectRow } />
|
|
<Code>{ sourceCode }</Code>
|
|
</div>
|
|
);
|