项目的要求是一个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. c++ union内存
			
    看一个例子: #include <iostream> #include <stdio.h> using namespace std; union A { int a; stru ...
    
			
    2. 
						
  2. CodeForces - 754D
			
    All our characters have hobbies. The same is true for Fedor. He enjoys shopping in the neighboring s ...
    
			
    3. 
						
  3. shell参数扩展
			
    http://zuyunfei.com/2016/03/23/Shell-Truncate-File-Extension/
    
			
    4. 
						
  4. Missing artifact com.h2database:h2:jar:1.4.197
			
    之前OK的项目再次打开pom上报错: 一起出现的现象: maven库中这个包和H2数据库的包每次项目右键→maven→update project都会产生.lastupdate文件.原来是以前从mav ...
    
			
    5. 
						
  5. 泡泡一分钟：Stabilize an Unsupervised Feature Learning for LiDAR-based Place Recognition
			
    Stabilize an Unsupervised Feature Learning for LiDAR-based Place Recognition Peng Yin, Lingyun Xu, Z ...
    
			
    6. 
						
  6. webkit下面的CSS设置滚动条
			
    webkit下面的CSS设置滚动条 1.主要有下面7个属性: ::-webkit-scrollbar 滚动条整体部分,可以设置宽度啥的 ::-webkit-scrollbar-button 滚动条两端 ...
    
			
    7. 
						
  7. Nginx配置跨域请求 Access-Control-Allow-Origin *
			
    当出现403跨域错误的时候 No 'Access-Control-Allow-Origin' header is present on the requested resource,需要给Nginx服 ...
    
			
    8. 
						
  8. arcengine右键实现new group layer的功能
			
    没有找到相关方法,但是有对图层组进行操作的资料. https://gis.stackexchange.com/questions/43620/how-do-i-reach-a-layer-inside ...
    
			
    9. 
						
  9. [development][c++] C++构造函数调用构造函数
			
    构造函数调用构造函数是会问题的. 外层函数返回的内存, 与被调用的构造函数返回的内存并不是一个内存. 错误示例代码如下: msg_log(const char *name, const char* t ...
    
			
    10. 
						
  10. U3d 入门
			
    环境搭建: 1.安装exe; 2.破解 ,百度
    
			
    11.