vhad/react-bootstrap-table2
1
0
Fork 0
mirror of https://github.com/gosticks/react-bootstrap-table2.git synced 2026-06-28 21:20:04 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

enhance clear filter story

Browse Source
This commit is contained in:
AllenFang
2019-01-20 14:07:05 +08:00
parent 16f89989f0
commit 7c79b64985
2 changed files with 29 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
packages/react-bootstrap-table2-example/examples/column-filter/clear-all-filters.js vendored
View File

@@ -1,13 +1,14 @@
import React from 'react';
import BootstrapTable from 'react-bootstrap-table-next';
import filterFactory, { textFilter } from 'react-bootstrap-table2-filter';
import filterFactory, { textFilter, dateFilter } from 'react-bootstrap-table2-filter';
import Code from 'components/common/code-block';
import { productsGenerator } from 'utils/common';
import { stockGenerator } from 'utils/common';
const products = productsGenerator(8);
const products = stockGenerator(8);
let nameFilter;
let priceFilter;
let stockDateFilter;
const columns = [{
dataField: 'id',
@@ -22,25 +23,36 @@ const columns = [{
})
}, {
dataField: 'price',
text: 'Product Price',
text: 'Price',
filter: textFilter({
getFilter: (filter) => {
priceFilter = filter;
}
})
}, {
dataField: 'inStockDate',
text: 'InStock Date',
formatter: cell => cell.toString(),
filter: dateFilter({
getFilter: (filter) => {
stockDateFilter = filter;
}
})
}];
const handleClick = () => {
nameFilter('');
priceFilter('');
stockDateFilter();
};
const sourceCode = `\
import BootstrapTable from 'react-bootstrap-table-next';
import filterFactory, { textFilter } from 'react-bootstrap-table2-filter';
import filterFactory, { textFilter, dateFilter } from 'react-bootstrap-table2-filter';
let nameFilter;
let priceFilter;
let stockDateFilter;
const columns = [{
dataField: 'id',
@@ -55,17 +67,27 @@ const columns = [{
})
}, {
dataField: 'price',
text: 'Product Price',
text: 'Price',
filter: textFilter({
getFilter: (filter) => {
priceFilter = filter;
}
})
}, {
dataField: 'inStockDate',
text: 'InStock Date',
formatter: cell => cell.toString(),
filter: dateFilter({
getFilter: (filter) => {
stockDateFilter = filter;
}
})
}];
const handleClick = () => {
nameFilter('');
priceFilter('');
stockDateFilter();
};
export default () => (

1
packages/react-bootstrap-table2-example/src/utils/common.js vendored
View File

@@ -70,6 +70,7 @@ export const stockGenerator = (quantity = 5) =>
Array.from({ length: quantity }, (value, index) => ({
id: index,
name: `Todo item ${index}`,
price: Math.floor((Math.random() * 2) + 1),
inStockDate:
new Date(startDate.getTime() + Math.random() * (endDate.getTime() - startDate.getTime()))
}));