优化模板中心
This commit is contained in:
parent
24b82c46bd
commit
64ddb0f97d
|
@ -37,6 +37,7 @@ export default class mytemplate extends React.Component{
|
||||||
topbar:"",
|
topbar:"",
|
||||||
top:"",
|
top:"",
|
||||||
toTopshow:false,
|
toTopshow:false,
|
||||||
|
toTopFlag:false,
|
||||||
center:"",
|
center:"",
|
||||||
bottom:""
|
bottom:""
|
||||||
}
|
}
|
||||||
|
@ -48,7 +49,6 @@ export default class mytemplate extends React.Component{
|
||||||
|
|
||||||
}
|
}
|
||||||
componentDidMount(e){
|
componentDidMount(e){
|
||||||
//监听滚动条滚动事件
|
|
||||||
|
|
||||||
let self=this;
|
let self=this;
|
||||||
|
|
||||||
|
@ -74,13 +74,19 @@ export default class mytemplate extends React.Component{
|
||||||
})
|
})
|
||||||
}).catch(err=>{
|
}).catch(err=>{
|
||||||
});
|
});
|
||||||
|
//监听滚动条滚动事件
|
||||||
|
this.refs.component.addEventListener('scroll',(event)=>{
|
||||||
}
|
let scrolHeight=event.target.scrollTop;
|
||||||
bindHandleScroll = (event) => {
|
|
||||||
console.log('滚动事件');
|
|
||||||
console.log('滚动事件',event);
|
console.log('滚动事件',event);
|
||||||
|
if(scrolHeight>300){
|
||||||
|
this.setState({toTopFlag:true});
|
||||||
|
}else{
|
||||||
|
this.setState({toTopFlag:false});
|
||||||
}
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
componentWillUnmount() {
|
componentWillUnmount() {
|
||||||
window.removeEventListener('scroll', this.bindHandleScroll);
|
window.removeEventListener('scroll', this.bindHandleScroll);
|
||||||
}
|
}
|
||||||
|
@ -341,10 +347,12 @@ export default class mytemplate extends React.Component{
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
</div>
|
</div>
|
||||||
<div ref="toTop" className="toTop-canvas" onMouseEnter={this.mouseupFn.bind(this)} onMouseLeave={this.mouseoverFn.bind(this)}>
|
{
|
||||||
|
this.state.toTopFlag?<div ref="toTop" className="toTop-canvas" onMouseEnter={this.mouseupFn.bind(this)} onMouseLeave={this.mouseoverFn.bind(this)}>
|
||||||
<img className="toTopBtn" onClick={this.toTop.bind(this)} src={this.state.toTopshow?'https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/totopbtn.svg':'https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/willtotop.svg'} alt=""/>
|
<img className="toTopBtn" onClick={this.toTop.bind(this)} src={this.state.toTopshow?'https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/totopbtn.svg':'https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/willtotop.svg'} alt=""/>
|
||||||
|
</div>:null
|
||||||
|
}
|
||||||
|
|
||||||
</div>
|
|
||||||
<div style={{textAlign:'center',color:'#BBC1D2',marginBottom:'15px'}}>到底部了哟,没有了哦</div>
|
<div style={{textAlign:'center',color:'#BBC1D2',marginBottom:'15px'}}>到底部了哟,没有了哦</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
Loading…
Reference in New Issue