ReactJS: Ошибка: превышена максимальная глубина обновления

Question

UPDATE3: у меня есть панель навигации, созданная функцией .map каждого элемента. Когда я нажимаю элемент на панели навигации, я хочу прокрутить до определенного c div моего SPA, для этого я создал функцию для прокрутки до каждой ссылки в каждом div моей страницы. Моя проблема в том, что мне нужно сохранить эти ссылки, чтобы получить их на моей панели навигации, и когда я динамически c создаю эти ссылки, я получаю эту ошибку:

Error: Maximum update depth exceeded. This can happen when a component repeatedly calls setState inside componentWillUpdate or componentDidUpdate. React limits the number of nested updates to prevent infinite loops.
setMyInputRef2
C:/Users/OMEN/Desktop/Web/tstbst/src/Pages/App.js:62

  60 | 
  61 | setMyInputRef (element) {
> 62 |     this.setState( { main : element });
     | ^  63 | };


 87 |     <div ref={(prop) => {this.setMyInputRef(prop)} }>

, где main - ссылка на div Main

UPDATE4: ОНО работает, когда я это делаю:

setMyInputRef = (element) => {
        this.setState( { main : element });
    };

<div ref={this.setMyInputRef} >

Но я хочу передать аргументы моей функции stMyInputRef, чтобы идентифицировать каждый NavbarItem для хранения ссылки, таким образом я не могу передать этот аргумент в моя функция

Вот что я хочу:

setMyInputRef = (element,stateRef) => {
        this.setState( {"stateRef" : element });
        // stateRef as "div1" 
    };

<div ref={(thisDivRef)=>this.setMyInputRef(thisDivRef,"div1")} >

почему я не могу этого сделать?

Answer 1

Ваша функция вызывается, когда вычисляется ref, а не когда пользователь щелкает мышью. Вот почему у вас бесконечное l oop. Когда страница загружается, ссылка вызывает функцию, изменяющую состояние, которая затем перезагружает страницу, et c ...

Если вы сообщите нам, что вы пытаетесь с этим сделать, мы могли бы помочь вам найти решение :)