Я пытаюсь отобразить данные, которые я получаю от бэкэнда через приставку в компоненте таблицы материалов, но когда я возвращаю компонент, поле данных появляется пустым. Я спрашиваю, загружают ли они данные и возвращают ли этот компонент, но он не работает, мне нужно вручную перезагрузить сайт, чтобы получить данные, вот мой код:
const Equipo = ({ reduxEquipo: { equipos, cargando }, getEquipos }) => {
useEffect(() => {
getEquipos();
// eslint-disable-next-line
}, [getEquipos]);
const equiposData = equipos.map(e => ({
key: e._id,
numero: (
<Badge color='primary'>
{<div style={{ fontSize: '12px' }}>{e.numero}</div>}
</Badge>
),
direccionip: e.direccionip,
usuario: e.usuario,
password: '********',
interfases: (
<Button
round
justIcon
size='sm'
color='github'
//onClick={() => confirmData(e.usuario, e._id)}
>
<Apps />
</Button>
),
descripcion: e.descripcion,
acciones: (
<div>
{/* Editar Usuario */}
<Button round justIcon size='sm' color='github'>
<Edit />
</Button>{' '}
{/* Eliminar Usuario */}
<Button
round
justIcon
size='sm'
color='github'
//onClick={() => confirmData(e.usuario, e._id)}
>
<Delete />
</Button>
</div>
)
}));
return (
<div>
<div className={classNames(classes.main, classes.mainRaised)}>
<div className={classes.container}>
<Card plain>
<CardBody plain>
<h3 className={classes.cardTitle}>Equipos...</h3>
<br />
{cargando ? (
<CustomLinearProgress color='primary' />
) : (
<MaterialTable
title={'Equipos...'}
columns={[
{ title: 'Equipo', field: 'numero' },
{ title: 'Dirección IP', field: 'direccionip' },
{ title: 'Usuario', field: 'usuario' },
{ title: 'Contraseña', field: 'password' },
{ title: 'Interfaces', field: 'interfases' },
{ title: 'Descripción', field: 'descripcion' },
{ title: 'Acciones', field: 'acciones' }
]}
isLoading={cargando}
data={equiposData}
options={{
showTitle: false,
paging: false,
search: true,
headerStyle: {
textAlign: 'center'
},
cellStyle: {
textAlign: 'center'
}
}}
/>
)}
</CardBody>
</Card>
</div>
</div>
</div>
);
};
Equipo.propTypes = {
getEquipos: PropTypes.func.isRequired,
reduxEquipo: PropTypes.object.isRequired
};
const mapStateToProps = state => ({
reduxEquipo: state.reduxEquipo
});
export default connect(mapStateToProps, { getEquipos })(Equipo);
с наилучшими пожеланиями