标签：ack javascrip 变量 list 返回顶部 const col 一个 asc
在挂载更新里面判断滚动条的距离(滚动条不能overflow: auto 踩坑)
componentDidMount(){
window.addEventListener(‘scroll‘ , ()=>{
let scrollTop = document.documentElement.scrollTop || document.body/scrollTop;
if(scrollTop > 500){
this.setState({
show : true
})
}else{
this.setState({
show : false
})
}
})
}
在this.state= ({})定义一个显示的变量
constructor(props){
super(props)
this.state = ({
show : false
})
}
在jsx语法里面
render() {
let { show } = this.state;
return (
<div className="common-back">
{
show &&
<div onClick={this.goTo} className="iconfont icon-huidaodingbu1"></div>
}
</div>
);
}
然后点击返回顶部,有动画效果的 , 没有动画用 window.scrollTo(0,0);
goTo(){
let scrollToTop = window.setInterval(function() {
let pos = window.pageYOffset;
if ( pos > 0 ) {
window.scrollTo( 0, pos - 20 ); // how far to scroll on each step
} else {
window.clearInterval( scrollToTop );
}
}, 2);
}
标签：ack javascrip 变量 list 返回顶部 const col 一个 asc
原文地址：https://www.cnblogs.com/gfweb/p/9775406.html
