1

私はreselectとreact reduxを使用しています。基本的なモーダル実装のセレクターを作成しようとしています。

私のセレクターは

const selectModal = (state) => state.get('modal');

のエラーをスローします

Cannot read property 'get' of undefined

編集: select modal と呼ぶ方法を示すように要求されましたが、違いはありません。

const mapStateToProps = createStructuredSelector({
  isVisible: selectModalIsVisible(),
});
const mapDispatchToProps = {
  hideModal,
  showModal
};
export default connect(mapStateToProps, mapDispatchToProps)(Modal);

これは、モーダル状態のコンテナが見つからないことを意味すると思います

おそらく、レデューサーまたはストアを正しく設定していません。私の減速機は

function modalReducer(state = initialState, action) {
  switch (action.type) {
    case HIDE_MODAL:
      return state.set(
        'isVisible', false);
    case SHOW_MODAL:
      return  state.set(
        'isVisible', true);
    default:
      return state;
  }
}

これは結合レデューサーと結合されてグロブになります

export default function createReducer(asyncReducers){
  return combineReducers({
    route: routeReducer,
    auth: authReducer,
    modal: modalReducer,
    ...asyncReducers
  });
}

そして私の店に注入されました

function configureStore(initialState = {}, history) {
  const middlewares = [
    sagaMiddleware,
    routerMiddleware(history),
  ];
  const enhancers = [
    applyMiddleware(...middlewares),
  ]
  const store = createStore(
    createReducer(),
    fromJS(initialState),
    compose(...enhancers)
  );

  store.runSaga = sagaMiddleware.run;
  //store.close = () => store.dispatch(END)

  store.runSaga(sagas);
  store.asyncReducers = {};
  return store;
}
var initialState = {}
const store = configureStore(fromJS(initialState), browserHistory);

reselect 内のエラーは行 73/74 params = dependencies.map にあります。

var selector = function selector(state, props) {
  for (var _len4 = arguments.length, args = Array(_len4 > 2 ? _len4 - 2 : 0), _key4 = 2; _key4 < _len4; _key4++) {
    args[_key4 - 2] = arguments[_key4];
  }

  var params = dependencies.map(function (dependency) {
    return dependency.apply(undefined, [state, props].concat(args));
  });
  return memoizedResultFunc.apply(undefined, _toConsumableArray(params));
};

モーダルにアクセスするには、immutableJS を別の方法で使用する必要がありますか、それともアプリの設定が正しくありませんか? フィードバックをお寄せいただきありがとうございます。

4

1 に答える 1

3

を使用してselectModalいるように使用している場合selectModalIsVisible、構文が間違っています。私はかなりcreateStructuredSelector理解していないと確信しています() => (state) => state.get('modal')。それは受け入れるだけです(state) => state.get('modal')

通常、私の使用法は次のcreateStructuredSelectorようになります

const getThing = (state, props) => state.things[props.thingId];
const getModal = state => state.get('modal');

const mapStateToProps = createStructuredSelector({
  thing: getThing, // notice no parens
  modal: getModal, // notice no parens
})

または、セレクター ファクトリが必要な場合:

// just pretend this selector was more complicated and needed memoization
const makeGetThing = () => createSelector(
  state => state.things,
  (state, props) => props.thingId,
  (things, thingId) => things[thingId]);
const getModal = state => state.get('modal');

const makeMapStateToProps = () => createStructuredSelector({
  thing: makeGetThing(), // yes parens
  modal: getModal, // no parens
})
于 2016-12-12T18:49:03.107 に答える