React JSX动态内容:顶部属性中的增量

Question

我绝对是react的初学者，所以请原谅我，我一直在创建动态内容，我无法在top属性中进行增量，在渲染之后，我使用map和top属性，我不知道如何增加num，我试过在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时没有多重渲染。