从mongoDB获取数据、设置状态并将属性传递给子组件不起作用

import React, { Component } from 'react';
import ChildComponent from './ChildComponent';
import MongoDB from 'mongodb';

class ParentComponent extends Component {
  constructor(props) {
    super(props);
    this.state = {
      data: null
    };
  }

  componentDidMount() {
    // 连接到mongoDB数据库
    const client = new MongoDB.MongoClient('mongodb://localhost:27017', { useNewUrlParser: true });
    client.connect((err) => {
      if (err) {
        console.error('Failed to connect to mongoDB:', err);
        return;
      }
      // 获取数据
      const db = client.db('myDatabase');
      const collection = db.collection('myCollection');
      collection.find({}).toArray((err, data) => {
        if (err) {
          console.error('Failed to fetch data from mongoDB:', err);
          return;
        }
        // 将数据设置为状态
        this.setState({ data });
      });
    });
  }

  render() {
    const { data } = this.state;
    return (
      <div>
        {data ? (
          <ChildComponent data={data} />
        ) : (
          <p>Loading data...</p>
        )}
      </div>
    );
  }
}

export default ParentComponent;