React16.x操作dom实现聊天记录框滚动

背景:
我用React做了一个聊天记录的窗口，每当来了新消息或者自己回复了消息之后，需要让聊天记录的那个框自己滚动到最底部，显示最新的消息。

思路：当有新消息的时候，就将新消息push到数组中，这个数组是放在store中受到观察的。那么在数组的内容发生变化的时候，组件就会重新渲染，在生命周期的:componentDidUpdate中，然后在这个生命周期中，拿到聊天记录框的dom，进行scroll就OK了。

在旧版本的React中，采用的是

ref='name'
this.refs.name

这样的形式，要知道在新版本中，this.refs.name这样的形式已经不推荐了，我百度搜了一下，都没有看到有人写一点。自己查了一下文档，得到以下结论：
1.在dom元素上设置ref，这里的ref是一个函数了

<div className='chat-content' ref={(chatContainer) => this.chatContainer = chatContainer}>
....省略具体内容
</div>

这样设置后，在生命周期中，就可以通过this,charContainer来获得dom元素了

2. 生命周期中滚动到最下端

componentDidUpdate() {
    this.chatContainer.scrollTop = this.chatContainer.scrollHeight
  }

就这么几行代码，就实现了自己的需求，最开始还纠结了很久。
记录下来，作为参考。如能帮助到他人，乐意之至。