Skip to content

Commit

Permalink
Updating README file
Browse files Browse the repository at this point in the history
Fix the dupplication of most of the readme file.
  • Loading branch information
aboeglin committed Jul 13, 2017
1 parent 0171381 commit 5692381
Showing 1 changed file with 1 addition and 58 deletions.
59 changes: 1 addition & 58 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -62,65 +62,8 @@ The app will be running at localhost:8080, the build command watches for changes
sources are located in src/example.


##API Description

###1) The component:
```javascript
<TransitionSwitch parallel={false}>
<Route exact path="/">
<Transition>home path</Transition>
</Route>
<Route path="/otherPath">
<Transition>other path</Transition>
</Route>
<Route path="/">
<Transition>other home</Transition>
</Route>
<Route path="/anotherPath">
<Transition>another path</Transition>
</Route>
</TransitionSwitch>
```

TransitionSwitch allows to perform transitions on route change. Given its name, it works like the router v4 Switch. It
means that only one route will be visible at all times. Except if parallel is set to true, which means that the entering
transition won't wait for the leaving transition to be finished.
NB: parallel may be renamed in the next revision.

###2) The transitions:
Like a switch, the children must be Route elements. The children of these route elements will be given hooks to perform
the transition. These hooks are :

```javascript
componentWillAppear(callback)

componentDidAppear()

componentWillEnter(callback)

componentDidEnter()

componentWillLeave(callback)

componentDidLeave()
```
The callbacks must be called after the transition is complete, in the case of animation, a good place is in the
onComplete. The interface is very much the same as react-trasition-group v1. Meaning that componentWillAppear is called
for the first time when the TransitionSwitch is mounted.

##Sample App

In case you want to quickly try it, there's a webpack setup and very rough sample app.
In order to build it you should run :
```
npm run build:example
npm run start:server
```
The app will be running at localhost:8080, the build command watches for changes in case you want to play with it, the
sources are located in src/example.


In the next update:
- improve the tests
- add warnings for uses that aren't allowed by the API.
- improve the example app
- improve the example app

0 comments on commit 5692381

Please sign in to comment.