Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit d84b614

Browse files
tweak README.md
1 parent 85f1eba commit d84b614

File tree

5 files changed

+144
-2
lines changed

5 files changed

+144
-2
lines changed

‎README.md

Lines changed: 22 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,25 @@
11
# react-bootstrap-table2
22
Rebuilt [react-bootstrap-table](https://github.com/AllenFang/react-bootstrap-table)
33

4-
## Development
5-
Please check [development guide](./docs/development.md).
4+
> `react-bootstrap-table2`'s npm module name is [**`react-bootstrap-table-next`**](https://www.npmjs.com/package/react-bootstrap-table-next) due to some guys already used it ;(
5+
6+
`react-bootstrap-table2` separate some functionalities from core modules to other modules like following:
7+
8+
* [`react-bootstrap-table2-next`](https://www.npmjs.com/package/react-bootstrap-table-next)
9+
* Core table module, include sorting and row selection
10+
* [`react-bootstrap-table2-filter`](https://www.npmjs.com/package/react-bootstrap-table2-filter)
11+
* Column filter Addons
12+
* [`react-bootstrap-table2-editor`](https://www.npmjs.com/package/react-bootstrap-table2-editor)
13+
* Cell Editing Addons
14+
* [`react-bootstrap-table2-paginator`](https://www.npmjs.com/package/react-bootstrap-table2-paginator)
15+
* Pagination Addons
16+
* [`react-bootstrap-z-overlay`](https://www.npmjs.com/package/react-bootstrap-table2-overlay)
17+
* Overlay/Loading Addons
18+
19+
This can help your application with less bundled size and also help us have clean design to avoid handling to much logic in kernal module(SRP).
20+
21+
## Migration
22+
If you are the user from legacy [`react-bootstrap-table`](https://github.com/AllenFang/react-bootstrap-table/), please have a look on [this](./docs/migration.md).
623

724
## Usage
825
See [getting started](https://react-bootstrap-table.github.io/react-bootstrap-table2/docs/getting-started.html).
@@ -13,6 +30,9 @@ See `react-bootstrap-table2` [storybook](https://react-bootstrap-table.github.io
1330
## Roadmap
1431
See [release plans](https://react-bootstrap-table.github.io/react-bootstrap-table2/blog/2018/01/24/release-plan.html).
1532

33+
## Development
34+
Please check [development guide](./docs/development.md).
35+
1636
## How should I run storybook example in my local?
1737

1838
```sh

‎docs/migration.md

Lines changed: 116 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,116 @@
1+
# Migration Guide
2+
3+
* Please see the [CHANGELOG](https://react-bootstrap-table.github.io/react-bootstrap-table2/blog/2018/01/24/new-version-0.1.0.html) for `react-bootstrap-table2` first drop.
4+
* Please see the [Roadmap](https://react-bootstrap-table.github.io/react-bootstrap-table2/blog/2018/01/24/release-plan.html) for `react-bootstrap-table2` in 2018/Q1.
5+
* Feel free to see the [offical docs](https://react-bootstrap-table.github.io/react-bootstrap-table2/docs/about.html), we list all the basic usage here!!
6+
7+
## Preface
8+
9+
Currently, **I still can't implement all the mainly features in legacy `react-bootstrap-table`**, so please watch our github repo or [blog](https://react-bootstrap-table.github.io/react-bootstrap-table2/blog/) to make sure the legacy features you wanted are already implemented on `react-bootstrap-table2`. Anyway, ask me by open issue is ok.
10+
11+
-----
12+
13+
`react-bootstrap-table2` separate some functionalities from core modules to other modules like following:
14+
15+
* [`react-bootstrap-table2-next`](https://www.npmjs.com/package/react-bootstrap-table-next)
16+
* Core table module, include sorting and row selection
17+
* [`react-bootstrap-table2-filter`](https://www.npmjs.com/package/react-bootstrap-table2-filter)
18+
* Column filter Addons
19+
* [`react-bootstrap-table2-editor`](https://www.npmjs.com/package/react-bootstrap-table2-editor)
20+
* Cell Editing Addons
21+
* [`react-bootstrap-table2-paginator`](https://www.npmjs.com/package/react-bootstrap-table2-paginator)
22+
* Pagination Addons
23+
* [`react-bootstrap-table2-overlay`](https://www.npmjs.com/package/react-bootstrap-table2-overlay)
24+
* Overlay/Loading Addons
25+
26+
This can help your application with less bundled size and also help `react-bootstrap-table2` have clean design to avoid handling to much logic in kernal module(SRP). Hence, which means you probably need to install above addons when you need specific features.
27+
28+
## Core Table Migration
29+
30+
There is a big chagne is that there's no `TableHeaderColumn` in the `react-bootstrap-table2`, instead you are supposed to be define the `columns` prop on `BootstrapTable`:
31+
32+
```js
33+
import BootstrapTable from 'react-bootstrap-table-next';
34+
35+
const columns = [{
36+
dataField: 'id',
37+
text: 'Product ID'
38+
}, {
39+
dataField: 'name',
40+
text: 'Product Name'
41+
}, {
42+
dataField: 'price',
43+
text: 'Product Price'
44+
}];
45+
46+
<BootstrapTable keyField='id' data={ products } columns={ columns } />
47+
```
48+
49+
The `text` property is just same as the children for the `TableHeaderColumn`, if you want to custom the header, there's a new property is: [`headerFormatter`](https://react-bootstrap-table.github.io/react-bootstrap-table2/docs/column-props.html#columnheaderformatter-function).
50+
51+
* [`BootstrapTable` Definitation](https://react-bootstrap-table.github.io/react-bootstrap-table2/docs/table-props.html)
52+
* [Column Definitation](https://react-bootstrap-table.github.io/react-bootstrap-table2/docs/column-props.html)
53+
54+
## Table Sort
55+
56+
Please see [Work with table sort](https://react-bootstrap-table.github.io/react-bootstrap-table2/docs/basic-sort.html).
57+
58+
- [x] Basic sorting
59+
- [x] Custom sort function
60+
- [x] Default Sort
61+
- [x] Remote mode
62+
- [x] Custom the sorting header
63+
- [ ] Custom the sort caret
64+
- [ ] Sort management
65+
- [ ] Multi sort
66+
67+
Due to no `TableHeaderColumn` so that no `dataSort` here, please add [`sort`](https://react-bootstrap-table.github.io/react-bootstrap-table2/docs/column-props.html#columnsort-bool) property on column definitation.
68+
69+
## Row Selection
70+
71+
Please see [Work with selection](https://react-bootstrap-table.github.io/react-bootstrap-table2/docs/basic-row-select.html).
72+
Please see [available selectRow configurations](https://react-bootstrap-table.github.io/react-bootstrap-table2/docs/row-select-props.html).
73+
74+
No huge change for row selection, but can not custom the selection column currently. Coming soon!!!
75+
76+
## Column Filter
77+
78+
Please see [Work with column filter](https://react-bootstrap-table.github.io/react-bootstrap-table2/docs/basic-filter.html).
79+
Please see [available filter configuration](https://react-bootstrap-table.github.io/react-bootstrap-table2/docs/filter-props.html).
80+
81+
- [x] Text Filter
82+
- [x] Custom Text Filter
83+
- [x] Remote Filter
84+
- [ ] Custom Filter Component
85+
- [ ] Regex Filter
86+
- [ ] Select Filter
87+
- [ ] Number Filter
88+
- [ ] Date Filter
89+
- [ ] Array Filter
90+
- [ ] Programmatically Filter
91+
92+
Remember to install [`react-bootstrap-table2-filter`](https://www.npmjs.com/package/react-bootstrap-table2-filter) firstly.
93+
94+
Due to no `TableHeaderColumn` so that no `filter` here, please add [`filter`](https://react-bootstrap-table.github.io/react-bootstrap-table2/docs/column-props.html#columnfilter-object) property on column definitation and [`filter`](https://react-bootstrap-table.github.io/react-bootstrap-table2/docs/table-props.html#filter-object) prop on `BootstrapTable`.
95+
96+
## Cell Edit
97+
98+
Please see [Work with cell edit](https://react-bootstrap-table.github.io/react-bootstrap-table2/docs/basic-celledit.html).
99+
Please see [available cell edit configurations](https://react-bootstrap-table.github.io/react-bootstrap-table2/docs/cell-edit-props.html).
100+
101+
Remember to install [`react-bootstrap-table2-editor`](https://www.npmjs.com/package/react-bootstrap-table2-editor) firstly.
102+
103+
No big changes for cell editing, [`validator`](https://react-bootstrap-table.github.io/react-bootstrap-table2/docs/column-props.html#columnvalidator-function) will not support the async call(Promise).
104+
105+
## Pagination
106+
107+
Please see [Work with pagination](https://react-bootstrap-table.github.io/react-bootstrap-table2/docs/basic-pagination.html).
108+
Please see [available pagination configurations](https://react-bootstrap-table.github.io/react-bootstrap-table2/docs/pagination-props.html).
109+
110+
Remember to install [`react-bootstrap-table2-paginator`](https://www.npmjs.com/package/react-bootstrap-table2-paginator) firstly.
111+
112+
No big changes for pagination, but still can't custom the pagination list, button and sizePerPage dropdown.
113+
114+
## Remote
115+
116+
> It's totally different in `react-bootstrap-table2`. Please [see](https://react-bootstrap-table.github.io/react-bootstrap-table2/docs/basic-remote.html).

‎packages/react-bootstrap-table2-editor/README.md

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,8 @@
44

55
**[Live Demo For Cell Edit](https://react-bootstrap-table.github.io/react-bootstrap-table2/storybook/index.html?selectedKind=Cell%20Editing)**
66

7+
**[API&Props Definitation](https://react-bootstrap-table.github.io/react-bootstrap-table2/docs/cell-edit-props.html)**
8+
79
-----
810

911
## Install

‎packages/react-bootstrap-table2-filter/README.md

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,8 @@
44

55
**[Live Demo For Column Filter](https://github.com/react-bootstrap-table/react-bootstrap-table2/blob/gh-pages-src/storybook/index.html?selectedKind=Column%20Filter)**
66

7+
**[API&Props Definitation](https://react-bootstrap-table.github.io/react-bootstrap-table2/docs/filter-props.html)**
8+
79
-----
810

911
## Install

‎packages/react-bootstrap-table2-paginator/README.md

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,8 @@
44

55
**[Live Demo For Pagination](https://react-bootstrap-table.github.io/react-bootstrap-table2/storybook/index.html?selectedKind=Pagination)**
66

7+
**[API&Props Definitation](https://react-bootstrap-table.github.io/react-bootstrap-table2/docs/pagination-props.html)**
8+
79
-----
810

911
## Install

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /