Доступ к состоянию маршрутизатора реакции в селекторе

Я перемещаю часть состояния своего приложения из магазина в URL-адрес.

В настоящее время я использую redux для управления состоянием своего приложения вместе с повторным выделением для создания селекторов. Селекторы вычисляют производные значения из состояния в хранилище redux (в принципе, это их единственный ввод).

Теперь часть состояния будет содержаться в URL-адресе, поэтому я не знаю, как его читать.

Я просмотрел response-router-redux, который на первый взгляд может показаться решение (действительно, я могу получить значение, которое хочу, используя state.routing.locationBeforeTransitions.query), но это не кажется правильным способом сделать это, учитывая, что в их документах говорится:

Вы не должны читать состояние местоположения непосредственно из магазина Redux.

Есть ли другой способ получить доступ к своему состоянию местоположения, или я должен просто проигнорировать это предупреждение и использовать его в своем селекторе?


reactjs react-redux react-router reselect react-router-redux
person Tom Fenech    schedule 21.09.2016    source источник
comment
вам нужен доступ к параметрам маршрутизатора из mapStateToProps?   -  person Kokovin Vladislav    schedule 21.09.2016
comment
@Utro селектор вызывается оттуда, но идея состоит в том, что вы передаете селектору только один аргумент, объект состояния. Думаю, я мог бы добавить то, что мне нужно от маршрутизатора к объекту состояния, используя ownProps ...   -  person Tom Fenech    schedule 21.09.2016
comment
есть способы: 1) получить ownProps.params в mapStateToProps 2) в компоненте: передать this.props.params.someparam действию 3) использовать redux-router, который сохраняет состояние вашего маршрутизатора внутри хранилища.   -  person Kokovin Vladislav    schedule 21.09.2016
comment
обычно селекторы могут иметь два параметра: состояние и свойство. Это довольно распространенное явление github.com/reactjs/reselect#accessing-react- реквизиты-селекторы   -  person Kokovin Vladislav    schedule 21.09.2016

Ответы (1)


arrow_upward
6
arrow_downward

Вы правы, что документы response-router-redux, похоже, не рекомендуют получать состояние вашего маршрутизатора таким образом.

Хотя селекторы Reselect обычно используют только первый аргумент (состояние), они фактически могут принимать второй аргумент (свойства компонента). Внутри этих реквизитов вы найдете params, передаваемый React Router (при условии, что они передаются компоненту, который вы пытаетесь connect).

Я включил тривиальный пример ниже, где все, что я делаю, это верхний регистр location, но вы можете представить себе создание настолько сложного селектора, который вы хотите, который включает другие селекторы, которые используют state для извлечения вещей из магазина Redux.

const selectLocation = (_state, props) => props.location;
const selector = createSelector(
  selectLocation, 
  (location) => ({ upperCasedLocation: location.toUpperCase() })
);

const MySmartComponent = (props) => <div>{props.upperCasedLocation}</div>;

export default connect(selector)(MySmartComponent);
person Rob Wise    schedule 22.09.2016