loadMore not called about react-infinite-scroller HOT 4 CLOSED

Should get around to making an FAQ on the README because every other issue I get for this package is about overflow-y or clear

from react-infinite-scroller.

Working now man

Thank you ! :)

from react-infinite-scroller.

First off, when you call setState you don't need to pass in the whole state with ...this.state. On your behalf, React uses something like Object.assign to merge the new state you set with the current state - However, it doesn't clone deeply so if you're adding to an object, it's fine at that point to use the spread operator: setState({ obj: { ...this.state.obj, newItem } }).

Also, don't use the ++ incrementer with setState, because, again, you're mutating pageStart instead of setting, if you need lines like that make sure to use { pageStart: this.state.pageStart + 1 }.

I think the actual problem with why it's not updating is because you're not meant to update the pageStart prop. If you want to keep a record of which page your on yourself, keep page in your state and update it in your loadMore. If you want InfiniteScroller to manage your pagination, use the page parameter that is given to loadMore

// this.state.page = 0
loadMore() {
    const nextPage = this.state.page + 1;
    this.setState({ page: nextPage });
    request.get(`/search?page=${nextPage}`)
}

-- or --

loadMore(page) {
    request.get(`/search?page=${page}`)
}

from react-infinite-scroller.

I tried like you said to me. No luck. loadMore is not called at all. Weird...

This is my code:

import React, { PropTypes, Component } from 'react'
import { injectIntl, intlShape } from 'react-intl'
import { Card, CardText, List, ListItem } from 'react-toolbox'
import { Loader } from '../../../commons'
import InfiniteScroll from 'react-infinite-scroller'
import moment from 'moment'

class UserActivityItemsList extends Component {
	constructor(props) {
		super(props)
		this.state = {
			hasMore: true,
			pageStart: 0
		}
	}

	loadMore() {
		console.log('------> LOAD MORE')
		const nextPage = this.state.pageStart + 1
		this.setState({
			pageStart: nextPage
		})
	}

	render() {
		return (
			Loading ... } >
				
					
						{ items }
					
					
				
			
		)
	}
}

UserActivityItemsList.propTypes = {
	intl: intlShape
}

export default injectIntl(UserActivityItemsList)

JSX is not interpreted correctly here...

Thank you man

from react-infinite-scroller.