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 ...
随机推荐
- Python实现C代码统计工具(三)
目录 Python实现C代码统计工具(三) 声明 一. 性能分析 1.1 分析单条语句 1.2 分析代码片段 1.3 分析整个模块 二. 制作exe Python实现C代码统计工具(三) 标签: Py ...
- 官方文档:Office VBA 参考
https://docs.microsoft.com/zh-CN/office/vba/api/overview/ Office VBA 参考 https://docs.microsoft.co ...
- nohup 同时实现记录日志和屏幕输出
nohup nohup命令:如果你正在运行一个进程,而且你觉得在退出帐户时该进程还不会结束,那么可以使用nohup命令.该命令可以在你退出帐户/关闭终端之后继续运行相应的进程.nohup就是不挂断 ...
- 连接mysql 数据库时出现2003 -can't connect to mysql server on 'localhost'(100038)的问题
通过eclipse连接数据库是出现了以下问题 可能是由于数据库未开启造成的,你需要手动开启数据库. 手动开启数据库的方法: 1 win+r键后,在cmd中输入services.msc,点击确定 点击左 ...
- bootstrap modal 弹出其他页面
此文是可以的,是复制的然后粘贴 1.不使用js 方式 1.1 按钮 <a class=" btn default" href="ui_modals_ajax_sam ...
- .NET Core开发日志——Global Tools
.NET Core 2.1引入了一个新的功能,Global Tools,其本质是包含控制台应用程序的nuget包,目前而言,还没有特别有用的工具,不过相信随着时间的推移,各种有创意或者实用性强的Glo ...
- .net core中使用Type.GetType()从字符串获取类型遇到的问题
问题背景是想在 appsettings.json 中动态配置依赖注入,依赖注入代码如下: services.AddSingleton(typeof(ISmsService), Type.GetType ...
- CH 1201 - 最大子序和 - [单调队列]
题目链接:传送门 描述输入一个长度为n的整数序列,从中找出一段不超过m的连续子序列,使得整个序列的和最大. 例如 $1,-3,5,1,-2,3$. 当 $m=4$ 时,$S=5+1-2+3=7$:当 ...
- 【鬼畜】UVA - 401每日一题·猛男就是要暴力打表
管他什么rev数组,msg数组简化代码 #define _CRT_SECURE_NO_WARNINGS #include <cmath> #include <iostream> ...
- CORS跨域-Nginx使用方法(Access-Control-Allow-Origin错误提示)
问题说明 当出现上图这个的时候,是访问请求外域URL无法访问,浏览器认为访问外域URL不安全,导致访问不了简称跨域问题.而这上面出现一句很重要的话“NO Access-Control-Allow-Or ...