Я пытаюсь выяснить, как отправить действие в одном случае с параметрами и без 'init ()', когда произошел componentDidMount. Проблема здесь в том, что у меня есть две страницы,
overview
и страница дополнительного маршрутизатора edit
Когда я переключаюсь между этими двумя страницами, мне нужно сохранить состояние, при перезагрузке window
мне нужно сбросить состояние. При переходе с подстраницы я использую react-router-dom
this.props.history({pathName: 'overview', state: LATES props I have from overivew})
init
произошло на моем HOC
export default WrappedComponent => class Initializable extends Component {
componentDidMount = () => this.props.init()
render = () => <WrappedComponent {...this.props} />
}
Ожидаемое решение: каким-то образом «отслеживать путь маршрутизатора» и сохранять состояние только для некоторых маршрутов. Или как-то избавиться от состояния при переключении с edit
на overview
, но сохраните его для обзора.
Или добавьте немного редуктора windows.reload.
Есть идеи?
Ожидаемое поведение:
состояние при перезагрузке окна
Текущее поведение:
-сохранить состояние при переключении между edit
на overrivew
- сбросить состояние между другими страницами
- не сбрасывать состояние при перезагрузке окна
Обзорный компонент
export class Overview extends Component {
//just for example
<div>
this.props.patients
this.props.search
this.props.sort
....
</div>
}
export const mapStateToProps = state => ({
patients: state.patients,
sort: state.patients.sort,
search: state.patients.search,
})
export const mapDispatchToProps = (dispatch, {location: {state = {}}}) => ({
init: () => dispatch(PatientActions.load(state)),
})
Редактировать компонент
export class Editextends Component {
//just for example
returnToList = () => this.props.history.push({pathname: '/overview', state})
<div>
<Button onClick={this.returnToList}>
this.props.patients
....
</div>
}
export const mapStateToProps = state => ({
patients: state.patients,
})
Действия пациента
const load = ({accessToken, ...params} = {}) => async dispatch => {
dispatch({
type: PatientActions.LoadingStarted,
})
let response = await api.load({accessToken, ...params})
dispatch({
type: PatientActions.ListLoaded,
response,
})
return response
}
Редуктор для пациента
export default (actionTypes, initialState = {}) => (state = {
sort: undefined,
pageSize: undefined,
...initialState,
}, action) => {
switch (action.type) {
case actionTypes.ListLoaded:
let filter = filterSelector({
...action,
sort: action.sort || initialState.sort,
search: action.search || initialState.search,
})
let {response: {result: {totalCount, list}}} = action
return {
...state,
...filter,
}
case actionTypes.LoadingStarted:
return {
...state,
isLoadingInProgress: true,
}
})