В DataTable отображается ошибка «Нет данных в таблице» - PullRequest
0 голосов
/ 05 июня 2018

Я использовал компонент DataTable для своего списка пользователей для отображения данных, хранящихся в моей базе данных.

Это мой файл global.js

import React, { Component } from 'react';
import $ from 'jquery';
import DataTable from 'datatables.net';


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


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

} );


class Global 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();
    }



  render() {
    return (
      <div>
      <h2 className="contact-table">CONTACT LIST</h2>
        <table>
          <tbody>
            <tr id="filter_global" style={{display: 'flex', justifyContent: 'flex-end'}}>
              <td style={{width: '100px', alignSelf: 'center'}}>Global search</td>
              <td  align="center"><input type="text" className="global_filter" id="global_filter" style={{width: 'auto',border: '1px solid',marginBottom: '0px'}} /></td>
            </tr>
          </tbody>
        </table>
        <table id="example" className="display" style={{width: '100%'}}>
          <thead>
            <tr>
              <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.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>
          
        </table>
      </div>

    );
  }
}

export default Global;

Это страница отображения, когда я ее открываю.После обновления страницы или добавления новых данных в таблицу возникает ошибка.

Its working when i open the page

При обновлении данных страницы таблица не работает и отображается ошибка.Но я получаю все данные и ошибку, что Нет данных в таблице

This is the page where i am getting the error

Может кто-нибудь сказать мне, что пошло не так.

Спасибо.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...