React Firebase映射不是函数

Question

我有一个问题，我试图使用Firebase和React来获取一些报告。

class Reports extends Component {
 state = {
  reports: []
 }

componentDidMount(){
const myUserId = fire.auth().currentUser.uid;

console.log(myUserId);

let reports = fire.database().ref('clients/' + myUserId + '/Reports/');

reports.on('value', function(snapshot){
  let reportsSnapshot = snapshot.val();
  this.setState({ reports: reportsSnapshot });
  console.log(this.state.reports);
}.bind(this));
}

render(){
  const reports = this.state.reports.map(report => {
    return <Report content={report.content} />
  });
  return (
    <div>
    {reports}
    </div>
  );

当我尝试编译时，它出现：

  

TypeError：this.state.reports.map不是函数

如何正确获取并映射？正确设置状态是否有问题？

预先感谢您的帮助。