In react-admin get access to redux store

主宰稳场 提交于 2019-12-01 02:11:04

问题


My question is related to react-admin repo.

I want to dispatch an action, outside of scope of a component, in order to do that, I've read that I need to get access to the actual redux store itself, and dispatch on in directly,

so I know that the Admin component has an initialState prop, but it only accepts default state object, not the store. So I can't make a store and pass it in.

My question is:

  • How do I access redux store of an Admin component?
  • How can I dispatch an action outside of a component, when using Admin as my main app component?

my current app entry looks like this:

<AppLayoutDirection>
    <Admin
      title="My App"
      locale="en"
      dataProvider={dataProvider}
      authProvider={authProvider}
      i18nProvider={i18nProvider}
      theme={themeProvider}
      customSagas={customSagas}
      appLayout={AppLayout}
    >
      {DynamicResource}
    </Admin>
  </AppLayoutDirection>

回答1:


When you say that you need to dispatch an action outside the scope of a component, I suppose that it's in reaction to another action that was dispatched in the past.

In that case, that's what react-admin calls a side effect. React-admin handles side effects using redux-saga. Here is how to create a custom saga:

// in src/bitcoinSaga.js
import { put, takeEvery } from 'redux-saga/effects';
import { showNotification } from 'react-admin';

export default function* bitcoinSaga() {
    yield takeEvery('BITCOIN_RATE_RECEIVED', function* () {
        yield put(showNotification('Bitcoin rate updated'));
    })
}

Register this saga in the <Admin> component as follows:

// in src/App.js
import React from 'react';
import { Admin } from 'react-admin';

import bitcoinSaga from './bitcoinSaga';

const App = () => (
    <Admin customSagas={[ bitcoinSaga ]} dataProvider={simpleRestProvider('http://path.to.my.api')}>
        ...
    </Admin>
);

export default App;

This is documented in the react-admin documentation, in the <Admin> chapter.



来源:https://stackoverflow.com/questions/54570213/in-react-admin-get-access-to-redux-store

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!