Je suis nouveau dans reactjs et réagis la table de bootstrap. Je veux ajouter rea-chargement dans mon composant de réaction avant que les données montrent. parce que les données montrent si longtemps. mais ne fonctionne pas.comment ajouter le chargement de réaction dans la table d'amorçage de réaction
ceci est mon code
import React, { Component } from 'react';
import { BootstrapTable, TableHeaderColumn } from 'react-bootstrap-table';
import PageHeader from 'react-bootstrap/lib/PageHeader';
import database from './database';
import root from 'window-or-global';
import Loading from 'react-loading';
class User extends Component {
constructor(props) {
super(props);
this.state = {
text:'',
products: []
};
this.userRef = database.ref('users');
}
componentDidMount() {
this.userRef.on('value', this.gotData, this.errData);
}
gotData = (data) => {
let newProducts = []
const userdata = data.val();
const keys = Object.keys(userdata);
for (let i = 0; i < keys.length; i++) {
const k = keys[i];
newProducts.push({
name: userdata[k].nama, address: userdata[k].address, email: userdata[k].email
});
}
this.setState({products : newProducts});
}
errData = (err) => {
console.log(err);
}
handleClick = (rowKey) => {
alert(this.refs.table.getPageByRowKey(rowKey));
}
render() {
return (
<div>
<Loading type ='spinning-bubbles' color='#e3e3e3' />
<div className="col-lg-12">
<PageHeader>Members</PageHeader>
</div>
<BootstrapTable
ref='table'
data={ this.state.products }
pagination={ true }
search={ true }>
<TableHeaderColumn dataField='name' isKey={true} dataSort={true}>Name</TableHeaderColumn>
<TableHeaderColumn dataField='address' dataSort={true}>Address</TableHeaderColumn>
<TableHeaderColumn dataField='email'>Email</TableHeaderColumn>
</BootstrapTable>
</div>
);
}
}
export default User;
Meilleurs voeux! Souhait de répondre.
s'il vous plaît me dire où le code doit être placé .. :-(@Mayank Shukla – Queen
vérifier la réponse mise à jour, utilisez le même code, il suffit de remplacer la partie chargeur, ça va fonctionner :) –
merci beaucoup .. :-) @Mayank Shukla – Queen