当前位置:  开发笔记 > 编程语言 > 正文

velocity-react - 在组件更新后动画化scrollTop

如何解决《velocity-react-在组件更新后动画化scrollTop》经验,为你挑选了0个好方法。

我正在写一个简单的"控制台",以聊天方式显示消息.消息从底部出现,然后向上移动.

我有工作代码,但是每次添加新的"li"时,我都想通过将容器滚动到底部来设置显示消息的动画.

当前代码:

import React from 'react';
import { render, findDOMNode } from 'react-dom';


export default React.createClass({
    componentDidUpdate : function(){
        var node = findDOMNode(this);
        node.scrollTop = node.scrollHeight;
    },
    render() {
        return (
            
    { this.props.messages.map(function(message, index){ return
  • [{message.time.format('HH:mm:ss')}] {message.action}
  • }) }
) } })

messages道具来自父组件和商店.

我发现这个速度插件:https://github.com/twitter-fabric/velocity-react我无法弄清楚如何在我的情况下使用它.所有的例子似乎都不适用(或者我只是不理解它们).

我很反应,一些概念仍然让我困惑,所以请理解.

我不想使用jQuery.

推荐阅读
放ch养奶牛
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有