response-admin: состояние администратора создается в магазине, но не обновляется ни при одной операции crud

Я впервые работаю с react-admin. У меня есть настраиваемое приложение для реагирования, и я хочу использовать внутри него response-admin. Следуя руководству, я обнаружил, что мне, вероятно, не нужно ничего делать, поскольку я Я использую компонент <Admin>, и предполагается, что администратор обнаружит, что он находится внутри приложения redux, и смонтирует его состояние под ключом администратора в магазине. Похоже, создается начальное состояние. Но он не обновляется никогда. Также я не вижу действий, связанных с react-admin, как RA/REGISTER_RESOURCE в инструментах redux dev.

введите здесь описание изображения

Мое значение по умолчанию createStore.js (это из шаблона реакции)

import { createStore, applyMiddleware, compose } from 'redux';
import { routerMiddleware } from 'connected-react-router';
import createSagaMiddleware from 'redux-saga';
import createReducer from './reducers';

export default function configureStore(initialState = {}, history) {
  let composeEnhancers = compose;
  const reduxSagaMonitorOptions = {};

  if (process.env.NODE_ENV !== 'production' && typeof window === 'object') {
    if (window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__)
      composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__({
        trace: true,
        traceLimit: 25,
      });
  }

  const sagaMiddleware = createSagaMiddleware(reduxSagaMonitorOptions);

  const middlewares = [sagaMiddleware, routerMiddleware(history)];

  const enhancers = [applyMiddleware(...middlewares)];

  const store = createStore(
    createReducer(),
    initialState,
    composeEnhancers(...enhancers),
  );

  store.runSaga = sagaMiddleware.run;
  store.injectedReducers = {}; // Reducer registry
  store.injectedSagas = {}; // Saga registry

  // Make reducers hot reloadable, see http://mxs.is/googmo
  /* istanbul ignore next */
  if (module.hot) {
    module.hot.accept('./reducers', () => {
      store.replaceReducer(createReducer(store.injectedReducers));
    });
  }

  return store;
}

Я тоже пробовал

import { routerMiddleware } from 'connected-react-router';
import createSagaMiddleware from 'redux-saga';
import { all, fork } from 'redux-saga/effects';
import createReducer from './reducers';

import { adminSaga, USER_LOGOUT } from 'react-admin';

export default ({ authProvider, dataProvider, history }) => {
  const reducer = createReducer();
  const resettableAppReducer = (state, action) =>
    reducer(action.type !== USER_LOGOUT ? state : undefined, action);

  const saga = function* rootSaga() {
    yield all([adminSaga(dataProvider, authProvider)].map(fork));
  };
  const sagaMiddleware = createSagaMiddleware();

  const composeEnhancers =
    (process.env.NODE_ENV === 'development' &&
      typeof window !== 'undefined' &&
      window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ &&
      window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__({
        trace: true,
        traceLimit: 25,
      })) ||
    compose;

  const store = createStore(
    resettableAppReducer,
    {},
    composeEnhancers(
      applyMiddleware(sagaMiddleware, routerMiddleware(history)),
    ),
  );
  sagaMiddleware.run(saga);

  store.runSaga = sagaMiddleware.run;
  store.injectedReducers = {}; // Reducer registry
  store.injectedSagas = {}; // Saga registry

  if (module.hot) {
    module.hot.accept('./reducers', () => {
      store.replaceReducer(createReducer(store.injectedReducers));
    });
  }
  return store;
};


где reducers.js - это

/**
 * Combine all reducers in this file and export the combined reducers.
 */

import { combineReducers } from 'redux';
import { connectRouter } from 'connected-react-router';
import { reducer as formReducer } from 'redux-form';

import history from 'utils/history';
import languageProviderReducer from 'containers/LanguageProvider/reducer';
import profilePageReducer from 'containers/ProfilePage/reducer';
import { adminReducer } from 'react-admin';

export default function createReducer(injectedReducers = {}) {
  const rootReducer = combineReducers({
    form: formReducer,
    language: languageProviderReducer,
    profilePage: profilePageReducer,
    admin: adminReducer,
    ...injectedReducers,
  });

  const mergeWithRouterState = connectRouter(history);
  return mergeWithRouterState(rootReducer);
}

Я много пробовал, но, похоже, не могу найти проблему. Любая помощь будет высоко ценится.


person Gurpreet Singh    schedule 11.05.2020    source источник


Ответы (2)


Магазин был в порядке. Все работало. Действия не отображались в расширении из-за этой ошибки. В итоге я потратил на это много времени.

Изменить: не все было хорошо. RA не обнаруживает мой магазин, поэтому создает свой собственный. Расширение redux dev tools показывало другой магазин, поэтому никаких действий от RA не было.

person Gurpreet Singh    schedule 12.05.2020

У меня возникла эта проблема при внедрении React Admin в другом приложении. Мне потребовалось некоторое время, чтобы понять, что проблема заключалась в том, что шаблонный код, который я скопировал из React Admin docs для инициализации хранилища означало, что новое хранилище инициализировалось при каждом рендеринге:

предлагается в документах:

const App = () => (
    <Provider
        store={createAdminStore({
            authProvider,
            dataProvider,
            history,
        })}
    >
        <Admin
            authProvider={authProvider}
            dataProvider={dataProvider}
            history={history}
            title="My Admin"
        >
        ...
    </Provider>
);

решение:

const store = createAdminStore({ authProvider, dataProvider, history });

const App = () => (
    <Provider
        store={store}
    >
        <Admin
            authProvider={authProvider}
            dataProvider={dataProvider}
            history={history}
            title="My Admin"
        >
        ...
    </Provider>
);
person 0llyds    schedule 01.06.2021