Sto cercando di separare un componente di presentazione da un componente contenitore. Ho un SitesTable
e un SitesTableContainer
. Il contenitore è responsabile dell'attivazione delle azioni di redux per recuperare i siti appropriati in base all'utente corrente.
Il problema è che l'utente corrente viene recuperato in modo asincrono, dopo che il componente contenitore viene visualizzato inizialmente. Ciò significa che il componente contenitore non sa di dover rieseguire il codice nella sua componentDidMount
funzione che aggiorna i dati da inviare al file SitesTable
. Penso di aver bisogno di rieseguire il rendering del componente contenitore quando uno dei suoi oggetti di scena (utente) cambia. Come posso farlo correttamente?
class SitesTableContainer extends React.Component {
static get propTypes() {
return {
sites: React.PropTypes.object,
user: React.PropTypes.object,
isManager: React.PropTypes.boolean
}
}
componentDidMount() {
if (this.props.isManager) {
this.props.dispatch(actions.fetchAllSites())
} else {
const currentUserId = this.props.user.get('id')
this.props.dispatch(actions.fetchUsersSites(currentUserId))
}
}
render() {
return <SitesTable sites={this.props.sites}/>
}
}
function mapStateToProps(state) {
const user = userUtils.getCurrentUser(state)
return {
sites: state.get('sites'),
user,
isManager: userUtils.isManager(user)
}
}
export default connect(mapStateToProps)(SitesTableContainer);