Реагировать на динамическое содержимое JSX: приращение в верхнее свойство

Question

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

class People extends React.Component {
componentDidMount = () => {

 //$('#Dynamic').hide()

}

constructor(props){
  super(props);
  this.state = {
    Info : []
  }

  var Ref = firebase.database().ref('Users');
  Ref.once('value' , (i) => {
    i.forEach((y)=>{
      var data = y.val()
      myArray[c] = data.Photo;
    //  alert(myArray[c]) ;
      c++ ; 

      this.setState({
        Info : myArray
              }) 

    })      
   }) 
  }

render () {
  n += 100;
    return (
        <div>
          <div id = 'Dynamic' >

    <div id = 'hi'> {  this.state.Info.map(i => 

    { return <img style = {{'top' : n  }} className = 'public'  src = {i}   /> }


      )} 



      </div>

     </div>

        </div>

    );

}



}

export default People

Answer 1

setState() не сразу мутирует this.state но создает переход состояния ожидания. Таким образом, нет многократного рендеринга во время вызова setState в петле.