javascript - 在 componentDidMount 内部使用 setState 后，状态数据被复制

Question

我正在向 Firestore 发出 get() 请求以获取数据。我能够将数据存储在我的组件状态中，但每次我尝试访问数据时，它都会显示为重复。我该如何预防？谢谢。

``

import React from 'react';
import fire from '../../config/firebase';

class ViewLists extends React.Component {
  constructor(props){
    super(props)
    this.state = {
      listData: []
    };
  }
     
 componentDidMount(){
  fire.firestore().collection('restaurantList')
  .get()
  .then(querySnapshot => {
    const lists = querySnapshot.docs.map(doc => doc.data());
    this.setState({ listData: lists });
    });
  }
  
  render() {
    const { listData } = this.state
    return (
      <div>
        {listData.map(list => console.log(list.user))}
      </div>
    );
  }
}

export default ViewLists;

``