chenglou / chenglou/react-motion

willEnter not working

Open
#383 4 comments 0 reactions 0 assignees View on GitHub
Dominant language
JavaScript
Stars
21.9k
Forks
1.1k
PR merge metrics
No merged PRs in 30d

Description

Hello guys, sorry for posting again almost on the same day, but I need to clear my mind about willEnter function.

I'm trying to use the TransitionMotion example from the README:

You'll be notice that I added willEnter no the example, but when I add the element, the animation dont fire for this new element. What I'm doing wrong? Thanks

Ps: I'm not using ES2016.

```
var React = require('react');
var Motion = require('reactor/node_modules/react-motion');
var TransitionMotion = Motion.TransitionMotion;
var spring = Motion.spring;

const Demo = React.createClass({
getInitialState() {
return {
items: [{key: 'a', size: 10}, {key: 'b', size: 20}, {key: 'c', size: 30}],
};
},
componentDidMount() {
this.setState({
items: [{key: 'a', size: 10}, {key: 'b', size: 20}], // remove c.
});
},
willLeave() {
// triggered when c's gone. Keeping c until its width/height reach 0.
return {width: spring(0), height: spring(0)};
},
willEnter(key) {
return {key, width: 0, height: 0};
},
add() {
this.setState({
items: [...this.state.items, {key: 'd', size: 20}]
});
},
render() {
return (


add

({
key: item.key,
style: {width: item.size, height: item.size},
}))}>
{interpolatedStyles =>
// first render: a, b, c. Second: still a, b, c! Only last one's a, b.


{interpolatedStyles.map(config => {
return

})}

}


);
},
});

module.exports = Demo;
```

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.