Как запросить componentDidMount() при прокрутке страницы?

Question

[BuG1K]

componentDidMount() {
  this.props.fetchData(url);
}

Answer 1

[Роман Александрович]

componentDidMount() {
   
      document.documentElement.addEventListener('scroll', this.handleScroll);
    
  }

  componentWillUnmount() {
    document.documentElement.removeEventListener('scroll', this.handleScroll);
  }

 
  handleScroll() {
   this.props.fetchData(url);
}

Comments

[X0lera]

А если уже есть render и при прокрутке страницы они добавлялись ?

[Роман Александрович]

X0lera,
если я вас правильно понял

componentDidMount() {
   this.props.fetchData(url);
      document.documentElement.addEventListener('scroll', this.handleScroll);
    
  }

[X0lera]

Я просто не могу понять как это работает

componentDidMount() {
    this.props.fetchData('url?limit=5');
      document.documentElement.addEventListener('scroll', this.handleScroll);
  }

  componentWillUnmount() {
   document.documentElement.removeEventListener('scroll', this.handleScroll);
  }

  handleScroll() {
    this.props.fetchData('url?limit=5&last_id=21323');
  }

[Роман Александрович]

X0lera,
componentDidMount - выполняется как только компонент прогрузился
document.documentElement.addEventListener - вешает функцию которая будет выполняться как только выполнится изменение
componentWillUnmount - выполнится после вышрузки компонента

это все можно прочитать погуглив. тут нет ничего гениального и сложного.

[X0lera]

Роман Александрович, при прокрутке страницы ошибка Cannot read property 'fetchData' of undefined
я добавил even
t

handleScroll(event) {
   this.props.fetchData('url?limit=5&last_id=' + this.props.last_id);
 };

[Роман Александрович]

X0lera,

constructor(){
super()

this.handleScroll=this.handleScroll.bind(this)
}

[X0lera]

Роман Александрович, Простите за глупый вопрос но как мне поставить условие чтоб срабатывал только при прокрутки в низ ?

[Роман Александрович]

X0lera, вот тут бурно обсуждают этот вопрос. https://stackoverflow.com/questions/31223341/detec...
пробуйте

[X0lera]

Роман Александрович, Спасибо