javascript - React JSX 动态内容：顶部属性的增量

Question

我在反应方面绝对是初学者，所以请原谅我，我被动态内容创建所困扰，我无法在顶级属性中进行增量，在渲染后我使用地图并且我正在使用顶级属性，我不知道如何增加数量，我在setstate中尝试过，但每次都不起作用，它发生在渲染之前，我只看到最后一个位置的图片

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因此，在循环中调用时不会进行多次渲染。