Реактивное движение с редуксом

Question

Я пытаюсь добавить новый комментарий в свое приложение React + Redux с помощью react-motion,

class Comments extends Component {
    getDefaultStyles() {
        const { comments } = this.props;
        return comments.map((c, i) => {
            return {
                key: "" + i,
                style: { top: -50, opacity: 0.2 },
                data: c
            }
        });
    }
    getStyles() {
        const { comments } = this.props;
        return comments.map((c, i) => {
            return {
                key: "" + i,
                style: {
                    top: spring(0, presets.gentle),
          opacity: spring(1, presets.gentle)
                },
                data: c
            }
        })
    }
    willEnter() {
        return { top: -50, opacity: 0.2 }
    }
    render() {
        let { comments } = this.props;
        return (
            <div>
                <TransitionMotion defaultStyles={this.getDefaultStyles()} styles={this.getStyles()} willEnter={this.willEnter}>
                {styles =>
                    <div>
                    {
                        styles.map((c) => {
                            return (
                                <Comment key={c.key} comment={c.data} style={{...c.style, overflow: 'hidden'}} />
                            )
                        })
                    }
                    </div>
                }
                </TransitionMotion>
            </div>
        )
    }
}

Затем стиль передается в первый div в Comment составная часть.

Во время загрузки комментариев анимация в порядке. Но пользователь добавляет комментарий, а затем fetchComments Метод вызывается для получения всех комментариев, анимация не происходит. Это как-то связано с редуксом? Я передаю свой комментарий, используя mapStateToProps а также connect,

Answer 1

Проблема была с ключом. Анимация происходила, но в нижней части комментариев, поскольку отображение через них назначало им ключ на основе индекса в массиве. Когда я изменил ключ, чтобы содержать comment.id номер начал работать правильно!