这里是Redux的新手,真的只是寻找"最佳实践"的答案.
我正在使用React + Redux构建聊天应用程序.我的应用程序看起来像这样:
到现在为止还挺好.一切都运行良好,但我不确定在这个序列中我应该如何/在哪里进行DOM操作.具体来说,message-list每当我的消息发生变化时,我都想滚动到容器的底部.
我需要解雇的是:messagesListElement.scrollTop = messagesListElement.scrollHeight;但不确定适当的地方在哪里.
您提到所有三个组件都是无状态的,这意味着消息保存在 redux 存储中,这意味着它们作为 props 传递给子组件。基本上有五种生命周期方法可以在组件更新之后/之前触发。
现在,由于您想在将新消息推送到消息状态后向下滚动,因此最好的位置是componentDidUpdate()
为什么不呢 componentWillReceiveProps - 这是将在新消息即将传递到组件的新 props 之前执行的函数。这是根据新 props 更新组件状态的最佳位置,但由于组件是无状态的,因此这不是滚动的正确位置。这可能会有帮助
希望能帮助到你 :)
| 归档时间: |
|
| 查看次数: |
2465 次 |
| 最近记录: |