数据表模块不起作用

Question

我使用了datatables模块并尝试实现数据库数据以代替默认数据显示，但是它不能正常工作。调用数据库数据时是否有任何问题。

数据表模块代码

function filterGlobal () {
    $('#example').DataTable().search(
        $('#global_filter').val()
    ).draw();
}

$(document).ready(function() {
    $('#example').DataTable();
    $('input.global_filter').on( 'keyup click',function () {
        filterGlobal();
    });
});

<table id="example" class="display" style="width:100%">
        <thead>
            <tr>
                <th>Name</th>
                <th>Position</th>
                <th>Office</th>
                <th>Age</th>
                <th>Start date</th>
                <th>Salary</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>Tiger Nixon</td>
                <td>System Architect</td>
                <td>Edinburgh</td>
                <td>61</td>
                <td>2011/04/25</td>
                <td>$320,800</td>
            </tr>
            <tr>
                <td>Garrett Winters</td>
                <td>Accountant</td>
                <td>Tokyo</td>
                <td>63</td>
                <td>2011/07/25</td>
                <td>$170,750</td>
            </tr>
            <tr>
                <td>Ashton Cox</td>
                <td>Junior Technical Author</td>
                <td>San Francisco</td>
                <td>66</td>
                <td>2009/01/12</td>
                <td>$86,000</td>
            </tr>
            <tr>
                <td>Cedric Kelly</td>
                <td>Senior Javascript Developer</td>
                <td>Edinburgh</td>
                <td>22</td>
                <td>2012/03/29</td>
                <td>$433,060</td>
            </tr>
            <tr>
                <td>Airi Satou</td>
                <td>Accountant</td>
                <td>Tokyo</td>
                <td>33</td>
                <td>2008/11/28</td>
                <td>$162,700</td>
            </tr>
            <tr>
                <td>Michael Bruce</td>
                <td>Javascript Developer</td>
                <td>Singapore</td>
                <td>29</td>
                <td>2011/06/27</td>
                <td>$183,000</td>
            </tr>
            <tr>
                <td>Donna Snider</td>
                <td>Customer Support</td>
                <td>New York</td>
                <td>27</td>
                <td>2011/01/25</td>
                <td>$112,000</td>
            </tr>
        </tbody>
        <tfoot>
            <tr>
                <th>Name</th>
                <th>Position</th>
                <th>Office</th>
                <th>Age</th>
                <th>Start date</th>
                <th>Salary</th>
            </tr>
        </tfoot>
    </table>

此代码是通过删除默认数据从mongodb导入数据库数据

function filterGlobal () {
    $('#example').DataTable().search(
        $('#global_filter').val()
    ).draw();
}

$(document).ready(function() {
    $('#example').DataTable();
    $('input.global_filter').on( 'keyup click',function () {
        filterGlobal();
    });
});

class Search extends React.Component {
  constructor(props){
        super(props);
        this.state={
            users:[],
            isLoaded:false,
            errorOnLoad:false,
        };
    }
    
    getuser(){
        fetch('/api/users/getuser',{
            method:'get'
        })
            .then((response)=>{
                return response.json()

            })
            .then((data)=>{
                this.setState({
                    users:data,
                    isLoaded:true,
                    err:{},
                    errorOnLoad:false,
                });
                this.getuser.bind();
            })
            .catch((err)=>{
                this.setState({
                    err:err,
                    errorOnLoad:true
                })
            })
    }

    componentDidMount(){
        this.getuser();
    }

<div>
    <h2 className="contact-table">CONTACT LIST</h2>
  <div>

    <table id="example" className="display" style=          {{width:'100%'}}>
      <thead>
        <tr>
            <th>Create Date</th>
            <th>Name</th>
            <th>Email Address</th>
            <th>Mobile Number</th>
            <th>Message</th>
            <th>Profile Photo</th>
        </tr>
      </thead>
      <tbody>
          {
            this.state.users.map((user)=>(
              <tr key={user.qid}>
                  <td>{user.createDate}</td>
                  <td>{user.name}</td>
                  <td>{user.emailAddress}</td>
                  <td>{user.mobileNumber}</td>
                  <td>{user.message}</td>
                  <td><img className="image-db" src={user.image} alt="" /></td>
              </tr>
            ))
          }
      </tbody>
      <tfoot>
        <tr >
            <th>Create Date</th>
            <th>Name</th>
            <th>Email Address</th>
            <th>Mobile Number</th>
            <th>Message</th>
            <th>Profile Photo</th>
        </tr>
      </tfoot>
    </table>
  </div>
</div>

使用数据表模块代码输出时

正在出现尝试从数据库数据中获取数据的情况，但同时也显示表中没有可用数据，并且数据表模块不起作用

谁能找到解决方案。

谢谢