Я создал диалог, который открывается в каждой строке таблицы, я могу редактировать и отправлять в этом диалоге информацию о человеке. Я закрываю диалог и мне нужно обновить страницу, прежде чем я увижу ее обновленной. Что мне нужно сделать, это обновить родительский компонент при закрытии диалога.
Я собрал бесплатную версию моего родительского компонента и то, как я вызываю данные ниже -
import React, { Fragment } from 'react';
import { connect } from 'react-redux';
import { Link, withRouter } from 'react-router-dom';
import PeopleEditDialog from './PeopleEditDialog';
class EnhancedTable extends React.Component {
constructor(props, context) {
super(props, context);
this.state = {
openPeopleEditDialog: false
};
this.handlePeopleEditDialog = this.handlePeopleEditDialog.bind(this);
}
handlePeopleEditDialog() {
this.setState({
openPeopleEditDialog: !this.state.openPeopleEditDialog
});
render() {
const { openPeopleEditDialog } = this.state;
const { loader, people, peopleListError } = this.props;
return (
<React.Fragment>
<Toolbar>
<div className="actions">
<Tooltip title="Edit">
<IconButton aria-label="Edit" onClick={this.handlePeopleEditDialog}>
<Edit />
</IconButton>
</Tooltip>
<PeopleEditDialog
open={this.state.openPeopleEditDialog}
onClose={this.handlePeopleEditDialog}
selected={selectedDialog}
/>
</div>
</Toolbar>
<div className="flex-auto">
<div className="table-responsive-material">
<Table>
<TableBody>
//Rows of people data
{people}
</TableBody>
</Table>
</div>
</div>
</React.Fragment>
)
);
}
}
const mapStateToProps = ({ peopleList }) => {
const { loader, people, peopleListError, appliedFilters } = peopleList;
return { loader, people, peopleListError, appliedFilters};
}
export default withRouter(connect(mapStateToProps, {})(withStyles(styles, { withTheme: true })(EnhancedTable)));
peopleList не обновляется, пока я не обновлю. Мне нужно применить что-то, чтобы получить последнюю версию, когда я закрываю диалоговое окно:
<PeopleEditDialog
open={this.state.openPeopleEditDialog}
onClose={this.handlePeopleEditDialog}
selected={selectedDialog}
/>
Так как мне вызвать последний из mapStateToProps, когда компонент закрывается, чтобы я получил обновленный список?