项目的要求是一个chartUI方式的聊天显示页面，根据聊天信息的不断增加，页面需要滑动一定距离，这样能看到最新的聊天结果，这样就需要在聊天结果返回之后触发滚动条向下滚动到一定的距离，代码如下：

componentDidUpdate(){

        document.documentElement.getElementsByClassName("speakLineW")[0].scrollTop = 550;//内容更新以后再设置

    }

componentDidUpdate 是在组件更新结束之后执行，在初始化render时不执行，

所以触发滚动条的事件写在了 componentDidUpdate 这个周期

												


											
React篇-滚动条下移的触发在react的生命周期分析的更多相关文章
	

    
								
  1. 玩转 React（五）- 组件的内部状态和生命周期
		
    文章标题总算是可以正常一点了-- 通过之前的文章我们已经知道:在 React 体系中所谓的 "在 JavaScript 中编写 HTML 代码" 指的是 React 扩展了 Jav ...
    
		
    2. 
						
  2. React.js 小书 Lesson20 - 更新阶段的组件生命周期
		
    作者:胡子大哈 原文链接:http://huziketang.com/books/react/lesson20 转载请注明出处,保留原文链接和作者信息. 从之前的章节我们了解到,组件的挂载指的是将组件 ...
    
		
    3. 
						
  3. React 学习笔记（1） 基础语法和生命周期
		
    参看:视频地址 简单搭建一个react-cli: 2. React.createElement() 将object转化为 React语法 import React from 'react' impor ...
    
		
    4. 
						
  4. 【React】学习笔记（二）——组件的生命周期、React脚手架使用
		
    原教程视频:ttps://www.bilibili.com/video/BV1wy4y1D7JT?p=2&spm_id_from=pageDriver 目录 一.组件的生命周期 1.1.生命周 ...
    
		
    5. 
						
  5. react 入坑笔记（六） - 组件的生命周期
		
    React 组件生命周期 详细参考: react 组件生命周期 组件的生命周期可分为三个状态: 1.Mounting:已经挂载/插入到真实 DOM 树上: 2.Updating:正在被重新渲染: 3. ...
    
		
    6. 
						
  6. Unity3D热更新之LuaFramework篇[06]--Lua中是怎么实现脚本生命周期的
		
    前言 用c#开发的时候,新建的脚本都默认继承自Monobehaviour, 因此脚本才有了自己的生命周期函数,如Awake,Start, Update, OnDestroy等. 在相应的方法中实现游戏 ...
    
		
    7. 
						
  7. React.js 小书 Lesson19 - 挂载阶段的组件生命周期（二）
		
    作者:胡子大哈 原文链接:http://huziketang.com/books/react/lesson19 转载请注明出处,保留原文链接和作者信息. 这一节我们来讨论一下对于一个组件来说,cons ...
    
		
    8. 
						
  8. React.js 小书 Lesson18 - 挂载阶段的组件生命周期（一）
		
    作者:胡子大哈 原文链接:http://huziketang.com/books/react/lesson18 转载请注明出处,保留原文链接和作者信息. 我们在讲解 JSX 的章节中提到,下面的代码: ...
    
		
    9. 
						
  9. React每隔0.2s颜色变淡 之生命周期 ，componentDidMount表示组件已经挂载
		
    05案例 每隔0.2s颜色变淡 componentDidMount表示组件已经挂载,可以进行DOM操作 import React, { Component } from "react&quo ...
    
		
    10. 
		

	


随机推荐
	

    
									
  1. ImageMagick、imagick和ghostscript三者的关联
			
    http://467754239.blog.51cto.com/4878013/1602518/ 一.功能概述 ImageMagick是第三方的图片处理软件,功能要比GD强大.建议两者都安装,并不冲突 ...
    
			
    2. 
						
  2. Android手机用KSWEB搭建Web服务器成功安装WordPress
			
    之前部落分享的几个免费Web服务器软件都是用来安装在本地电脑上,搭建Apache.PhpMyAdmin.MySQL等网站运行环境,然后我们就可以在电脑上测试运行Wordpress.Discuz! 论坛 ...
    
			
    3. 
						
  3. 【连载6】二手电商APP的导购功能与关系链机制分析
			
    导读:得益于十余年来各种一手电商平台对市场与用户的教育以及共享.分享经济浪潮的兴起,互联网化的二手.闲置商品买卖.置换成为越来越普遍且简单可实现的生活方式. 第三章目录: 三.对比:主流二手电商竞品的 ...
    
			
    4. 
						
  4. day_5.28 py网络编程
			
    端口 socket简介: socket为一个类   s接收的是返回的对象引用 2018-5-28 15:52:47 开始进行网络编程 udp 套接字 encode() 编码 decode() 解码 ' ...
    
			
    5. 
						
  5. Kindle2018 一周使用报告
			
    使用2018年年末刚刚发布的KPW有一周时间了,可以借这个机会来对这部设备做一个使用报告了. 那咱们就参考如下描述吧: 1.轻薄便携:6英寸的屏幕,11.6厘米*16.7厘米的机身尺寸,加上仅有8.2 ...
    
			
    6. 
						
  6. JavaScript外部函数调用AngularJS的函数、$scope
			
    x 场景: 需要在用FusionCharts画的柱状图中添加点击事件,But弹出框是Angularjs搞的,我想的是直接跳到弹出框的那个路由里,然后在弹出框的控制器中绑定数据即可: /* 点击事件 * ...
    
			
    7. 
						
  7. mysql事务及慢查询
			
    1, 在 MySQL 中只有使用了 Innodb 数据库引擎的数据库或表才支持事务 l 原子性:构成事务的的所有操作必须是一个逻辑单元,要么全部执行,要么全部不执行. l 稳定性(一致性):数据库在事 ...
    
			
    8. 
						
  8. CMSampleBufferRef转换
			
    参考链接:https://blog.csdn.net/shenyi0106/article/details/47004039 https://blog.csdn.net/jeffasd/article ...
    
			
    9. 
						
  9. Uniform Resource Name Server
			
    HTTP The Definitive Guide 按址标识 identify by address 按名标识 identify by name Domain Name Server Uniform  ...
    
			
    10. 
						
  10. php性能提升与检测
			
    1.使用xhprof分析器检测性能各种消耗 2.php-fpm中进程池的配置参数查看最大进程数.进程最大处理http请求量.进程时间过多的http请求.每个进程使用的最大内存. 参考地址:https: ...
    
			
    11.