AllenFang/react-bootstrap-table

Add animations with react-flip-move

Open

#981 opened on Jan 22, 2017

View on GitHub
 (5 comments) (0 reactions) (0 assignees)JavaScript (2,240 stars) (795 forks)batch import
help wanted

Description

I use react-flip-move as a drop in replacement for my tables to create easy animations. It's easy enough to modify existing code that already builds tables in react by replacing the element with

<table>
  <FlipMove typeName='tbody'>
    {this.renderRows()}
  </FlipMove>
</table>

I believe the easiest to add this functionality would be the ability to pass in a wrapper object that react-bootstrap-table would use to replace the tbody element that react-bootstrap-table creates, but the API doesn't currently allow this.

Does this approach seem correct?

Contributor guide

Tech stack
reactjavascript
Domain
frontend
Issue type
feature
DifficultyEstimated implementation difficulty for a new contributor, from 1 for very small changes to 5 for expert-level work.
3
Estimated timeA rough time range for an experienced contributor to investigate, implement, test, and prepare a pull request.
1-3 hours
Activity statusHow available the issue appears right now: fresh, active, stale, blocked, or waiting on maintainer input.
stale
ClarityHow clearly the issue explains the expected change, acceptance criteria, and next step.
mostly clear
Prerequisites
Reactreact flip movereact bootstrap table internals
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
30
Research direction
Examine the source code of react bootstrap table to locate where the <tbody> element is rendered and how rows are mapped. Check the issue comments for any additional feedback from maintainers or users. Propose adding a prop like `tbodyWrapper` that accepts a component to replace the default <tbody>, similar to the suggested approach using FlipMove. Ensure the solution maintains backward compatibility.