patch for 20180624 release

This commit is contained in:
AllenFang
2018-06-24 15:57:37 +08:00
parent 15581a296a
commit efe38dbd54
4 changed files with 100 additions and 3 deletions
+43
View File
@@ -33,6 +33,7 @@ You can get all types of filters via import and these filters are a factory func
* SelectFilter
* NumberFilter
* DateFilter
* CustomFilter
* **Coming soon!**
## Text Filter
@@ -198,6 +199,48 @@ const dateFilter = dateFilter({
// omit...
```
## Custom Filter
```js
import filterFactory, { customFilter } from 'react-bootstrap-table2-filter';
const columns = [..., {
dataField: 'date',
text: 'Product Name',
filter: customFilter(),
filterRenderer: (onFilter, column) => .....
}];
<BootstrapTable keyField='id' data={ products } columns={ columns } filter={ filterFactory() } />
```
In custom filter case, you are suppose to finish following two steps:
1. Call `customFilter` and pass to `column.filter`
2. Give `column.filterRenderer` as a callback function and return your custom filter element.
### column.filterRenderer
This function will pass two argument to you:
1. `onFilter`: call it to trigger filter when you need.
2. `column`: Just the column object!
In the end, please remember to return your custom filter element!
### customFilter
`customFilter` function just same as `textFilter`, `selectFilter` etc, it is for customization reason. However, in the custom filter case, there're only few props are valid:
```js
import filterFactory, { FILTER_TYPES, Comparator } from 'react-bootstrap-table2-filter';
const customFilter = customFilter({
type: FILTER_TYPES.NUMBER, // default is FILTER_TYPES.TEXT
comparator: Comparator.EQ, // only work if type is FILTER_TYPES.SELECT
caseSensitive: false, // default is true
})
```
<hr />
## Programmatically Filter
+31 -2
View File
@@ -14,18 +14,24 @@ title: Column Filter Props
* [selectFilter](#selectFilter)
* [numberFilter](#numberFilter)
* [dateFilter](#dateFilter)
* [customFilter](#customFilter)
* [Comparator](#comparator)
* [FILTER_TYPES](#filter-types)
## **Getting Started**
Please check [Getting Started Guide](./basic-filter.html)
## **How to use**
You should apply following two props to enable filter functionality:
* `filterFactory`
* `filters` (Available filters)
* Give `filter` prop on `BootstrapTable` which value is the return value from calling `filterFactory` function
* Add `filter` property on `column` object:
* textFilter
* selectFilter
* numberFilter
* dateFilter
* customFilter
For example:
```js
import BootstrapTable from 'react-bootstrap-table-next';
@@ -318,6 +324,19 @@ const columns = [{ ... }, { ... }, {
<BootstrapTable keyField='id' data={ products } columns={ columns } filter={ filterFactory() } />
```
## customFilter
**Required**: NONE
**Optional**:
### customFilter.type - [String]
* Assign the filter mode when `react-bootstrap-table` filering your data, please check [FILTER_TYPES](#filter-types) for available values.
### customFilter.comparator - [Comparator]
* Specify what kind of comparator to compare. Default is `Comparator.LIKE`. But if `customFilter.type` is `FILTER_TYPES.SELECT`, this default value will be `Comparator.EQ`
### customFilter.caseSensitive - [Boolean]
* default is `false`, and `true` will only work when comparator is `LIKE`.
## **Comparator**
We support the following ways to do the comparison. Each `filter` has its default comparator. For more information, please take refer to the introduction of props above.
@@ -330,3 +349,13 @@ We support the following ways to do the comparison. Each `filter` has its defaul
| 5 | Comparator.GE | >= | |
| 6 | Comparator.LT | < | |
| 7 | Comparator.LE | <= | |
## **FILTER_TYPES**
Following properties is valid in `FILTER_TYPES`:
* TEXT
* SELECT
* NUMBER
* DATE
You will only need the `FILTER_TYPES` when you are customize the filter component and you want to assign a specify filter mode.
+1 -1
View File
@@ -88,7 +88,7 @@ Please see [available filter configuration](./filter-props.html).
- [x] Text Filter
- [x] Custom Text Filter
- [x] Remote Filter
- [ ] Custom Filter Component
- [x] Custom Filter Component
- [ ] Regex Filter
- [x] Select Filter
- [x] Custom Select Filter
+25
View File
@@ -0,0 +1,25 @@
---
title: New Release (2018-06-24)
author: Allen Fang
authorURL: https://twitter.com/allenfang_tw
---
## Changed Packages
This release bump following packages:
* `react-bootstrap-table-next@0.1.14`
* `react-bootstrap-table2-paginator@0.1.5`
* `react-bootstrap-table2-filter@0.3.0`
## Changelog
### Bug fixes
* Fix table will jump to first page after cell editing in remote mode([42c6bc0](https://github.com/react-bootstrap-table/react-bootstrap-table2/commit/42c6bc03370fa5ac0cdbefb69503e5b72c48cb53))
* Click on filter will trigger sorting([#380](https://github.com/react-bootstrap-table/react-bootstrap-table2/issues/380))
### Features
* Support custom filter([#389](https://github.com/react-bootstrap-table/react-bootstrap-table2/pull/389))
### Enhancements
N/A