constructor(props) { super(props); this.state = { data: [], loading: false, hasMore: true, height:2000 } } onScrollHandle(event) { const clientHeight = event.target.documentElement.clientHeight const scrollHeight = event.target.documentElement.scrollHeight const scrollTop = event.target.documentElement.scrollTop const isBottom = (clientHeight + scrollTop === scrollHeight) const height=this.state.height; if(clientHeight + scrollTop+100>scrollHeight){ this.setState({ height: height+2000, }); } } componentDidMount() { window.addEventListener('scroll', this.onScrollHandle.bind(this)); } componentWillUnmount() { window.removeEventListener('scroll', this.onScrollHandle.bind(this)); } render() { return ( <div style={{height:this.state.height+'px',overflowY: "scroll",backgroundColor:"red"}} > </div> ); }
react 下拉滚动功能
最新推荐文章于 2025-06-28 15:29:20 发布