React篇-滚动条下移的触发在react的生命周期分析
项目的要求是一个chartUI方式的聊天显示页面,根据聊天信息的不断增加,页面需要滑动一定距离,这样能看到最新的聊天结果,这样就需要在聊天结果返回之后触发滚动条向下滚动到一定的距离,代码如下:
componentDidUpdate(){
document.documentElement.getElementsByClassName("speakLineW")[0].scrollTop = 550;//内容更新以后再设置
}
componentDidUpdate 是在组件更新结束之后执行,在初始化render时不执行,
所以触发滚动条的事件写在了 componentDidUpdate 这个周期
React篇-滚动条下移的触发在react的生命周期分析的更多相关文章
- 玩转 React(五)- 组件的内部状态和生命周期
文章标题总算是可以正常一点了-- 通过之前的文章我们已经知道:在 React 体系中所谓的 "在 JavaScript 中编写 HTML 代码" 指的是 React 扩展了 Jav ...
- React.js 小书 Lesson20 - 更新阶段的组件生命周期
作者:胡子大哈 原文链接:http://huziketang.com/books/react/lesson20 转载请注明出处,保留原文链接和作者信息. 从之前的章节我们了解到,组件的挂载指的是将组件 ...
- React 学习笔记(1) 基础语法和生命周期
参看:视频地址 简单搭建一个react-cli: 2. React.createElement() 将object转化为 React语法 import React from 'react' impor ...
- 【React】学习笔记(二)——组件的生命周期、React脚手架使用
原教程视频:ttps://www.bilibili.com/video/BV1wy4y1D7JT?p=2&spm_id_from=pageDriver 目录 一.组件的生命周期 1.1.生命周 ...
- react 入坑笔记(六) - 组件的生命周期
React 组件生命周期 详细参考: react 组件生命周期 组件的生命周期可分为三个状态: 1.Mounting:已经挂载/插入到真实 DOM 树上: 2.Updating:正在被重新渲染: 3. ...
- Unity3D热更新之LuaFramework篇[06]--Lua中是怎么实现脚本生命周期的
前言 用c#开发的时候,新建的脚本都默认继承自Monobehaviour, 因此脚本才有了自己的生命周期函数,如Awake,Start, Update, OnDestroy等. 在相应的方法中实现游戏 ...
- React.js 小书 Lesson19 - 挂载阶段的组件生命周期(二)
作者:胡子大哈 原文链接:http://huziketang.com/books/react/lesson19 转载请注明出处,保留原文链接和作者信息. 这一节我们来讨论一下对于一个组件来说,cons ...
- React.js 小书 Lesson18 - 挂载阶段的组件生命周期(一)
作者:胡子大哈 原文链接:http://huziketang.com/books/react/lesson18 转载请注明出处,保留原文链接和作者信息. 我们在讲解 JSX 的章节中提到,下面的代码: ...
- React每隔0.2s颜色变淡 之生命周期 ,componentDidMount表示组件已经挂载
05案例 每隔0.2s颜色变淡 componentDidMount表示组件已经挂载,可以进行DOM操作 import React, { Component } from "react&quo ...
随机推荐
- Atom与markdown
简述 Atom是github开发的开源跨平台的编辑器,Atom的强大可以与大名鼎鼎的Sublime Text相媲美.因为使用过Sublime Text,所以用Atom上手很快.这篇文章主要介绍使用At ...
- VMWare共有3种网络连接模式
VMWare共有3种网络连接模式,分别是: 1. bridged(桥接模式):虚拟机将直接连接到物理局域网,使自身独立于宿主机外,从局域网路由器获取IP.这种方式虚拟OS可以和局域网中其他终端实现互 ...
- MongoDB数据库连接失败
win10下原来一直在用的MongoDB突然连接不上了,报错如下: 解决方法是:net start MongoDB重启服务
- day2 二、编程语言、python解释器和变量
一.编程语言分类 1.机器语言 直接用计算机能理解的二进制指令编写程序,直接控制硬件,需要了解硬件的操作细节. 2.汇编语言 用英文标签取代二进制编写程序,也是直接控制硬件,也需要了解硬件的操作细节. ...
- 将多个图片合并到一个TIF文件里(非 GDAL) 优化版
不知道为什么,网上对TIF的操作的资料少得可怜,包括CodeProject上都没有找到多少,在网上大多用GDAL,但这个东西,对只想做个合并图片的功能来说,实在是牛刀杀鸡,(9个DLL要带全,相当的恐 ...
- cmd识别不了mysql命令
问题现象:安装配置过MySQL和环境变量,当时用的好好的,过了几天再试发现cmd识别不了了: 之前maven的mvn命令也遇到过这个问题. 原因:win10中配成这个样子,重启之后会时效: 解决方法: ...
- tensorflow 一维卷积 tf.layers.conv1()使用
在自然语言处理中,主要使用一维的卷积. API tf.layers.conv1d( inputs, filters, kernel_size, strides=1, padding='valid', ...
- php之运算符
运算符优先级相同,运算符的结合方向决定了该如何运算, 一.运算符优先级 组合方向 运算符 附加信息 无 clone new clone和new 左 [ array 右 ** 算术运算符 右 ++ -- ...
- 【编译原理】c++实现自上而下语法分析器
写在前面:本博客为本人原创,严禁任何形式的转载!本博客只允许放在博客园(.cnblogs.com),如果您在其他网站看到这篇博文,请通过下面这个唯一的合法链接转到原文! 本博客全网唯一合法URL:ht ...
- 【LBS】基于地理位置的搜索之微信 附近的人 简单实现
缘由 本周技术群有一个同学说我们该怎么实现 由近到远的基于地理位置的搜索,我创业做电商的系统做过类似这样的服务,我把我们以前的操作给大家分享下 什么是LBS LBS 全称是 Location Bas ...