私は、プレゼンテーションコンポーネントをコンテナコンポーネントから分離しようとしています。私はSitesTable
とSitesTableContainer
です。コンテナは、現在のユーザーに基づいて適切なサイトをフェッチするための冗長アクションをトリガーする役割を果たします。問題は、コンテナコンポーネントが最初にレンダリングされた後に、現在のユーザーが非同期にフェッチされることです。つまり、コンテナコンポーネントは、SitesTable
に送信するデータを更新するcomponentDidMount
関数でコードを再実行する必要があることを認識しません。私は、その小道具(ユーザ)の1つが変更されたときにコンテナコンポーネントを再レンダリングする必要があると思う。どのように私はこれを正しく行うのですか?小道具変更時に反応コンポーネントを再レンダリングする
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);
のようになります方法です変更する – thsorens
なぜあなたは、その小道具を変更していない場合、SitesTableを再レンダリングする必要がありますか? – QoP
@QoP 'componentDidMount'でディスパッチされているアクションは、アプリケーション状態の' sites'ノードを変更し、 'SitesTable'に渡されます。 SitesStableの 'sites'ノードが変更されます。 – David