![](https://img-blog.csdnimg.cn/20201014180756928.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
React
浦东余春娇
佛系博主,随缘写写
展开
-
React监听页面滑动到底部自动加载
在componentDidMount里开启页面滚动监听window.addEventListener('scroll', this.handleScroll, false)在componentWillUnmount组件卸载时清除监听window.removeEventListener('scroll', this.handleScroll)获取滚动条在Y轴的距离getScrollTop = () => { var scrollTop = 0, bodyScrollTop .原创 2021-04-29 17:29:03 · 2677 阅读 · 0 评论 -
React监听页面尺寸,实时计算设置宽高
React监听页面尺寸,实时计算设置宽高思路通过componentDidMount/componentWillUnmount进行监听/解除监听当前视窗的宽高将当前的宽高进行所需的计算后赋值给state中对应的变量页面的style中直接绑定this.state对应的宽高举例我需要实时设置页面中某个<div></div>的高度为视窗高度减去104px写一个方法:setPageHeight = () => { this.setState({原创 2021-01-20 18:23:03 · 4795 阅读 · 1 评论 -
ReactEcharts遇到的坑(ReactEcharts相关属性)
ReactEcharts组件会默认将原渲染图表的数据和二次渲染图表的数据默认合并,即在图表某些变量改变时二次渲染echarts图表,如果本次渲染少了之前的参数,会一并把之前参数的数值合并到图表(举个栗子:此图表中,当切换筛选条件后,筛选后的选项不存在“Other”的数值,但还是会把第一次遗留的“Other”数值合并上去,只有当新图表和旧图表都用相同参数,才会替换,否则就是合并)解决方案:发...原创 2020-04-27 15:18:38 · 1732 阅读 · 4 评论 -
JS代码判断用户设备为手机或电脑进行区分跳转操作
JS判断用户设备为手机或电脑端,进行跳转为了达到更好的用户体验,当下大多数的站点都会将网站区分为手机页面(Mobile 端)和电脑页面(PC端)通常会采用两种方法:1.对于页面容量不是很大的展示类网站,如搜索引擎,都会做成响应式,用一套代码解决;2.而对于页面内容较多的,以交互为主的网站,通常会使用两套代码,这就产生了一个问题:如何判断用户的设备是PC还是Mobile,以进行正确的跳转来防止用户访...原创 2020-01-21 16:18:00 · 554 阅读 · 0 评论 -
今日开发问题:React无法插入<img>图片的解决
今日开发工作中在给页面插入图片时遇到一个问题,<img>标签插入图片失败,因相对路径较复杂,一开始以为是路径出错,纠结于../的数量问题,尝试了很多次也无果。之后干脆直接将素材图片放入jsx同一目录下,但仍无法加载。后发现问题:React加载图片但时候不能直接使用html的<img src='url'>方法插入,可以用以下两种方法插入图片:使用导入的方法:在头部先...原创 2019-11-15 23:04:26 · 824 阅读 · 0 评论