如何从非组件辅助函数访问 redux 的商店？答案

【问题标题】：How can you access redux's store from a non-component helper function?如何从非组件辅助函数访问 redux 的商店？
【发布时间】：2017-01-25 21:54:49
【问题描述】：

当我想从我的 redux 存储中删除某些内容时，我会调用一个辅助函数。但是，我需要能够访问函数内的当前存储来确定下一步该做什么。这是我想做的：

export function deleteDocument (id) {
    this.props.dispatch(deleteShape({id}));

    const getStore = getStore(); //<-- I need something like this

    if(getStore.documents && !getStore.documents.find(doc => doc.selected)){
        this.props.dispatch(makeTopDocumentSelected());
    }
}

我从一个组件调用这个函数并将“this”上下文传递给它，这样如果你对此感到好奇，它就可以访问调度。但是，如果我尝试引用我传递的道具，它不会在“deleteShape”调用之后更新，因为这个函数没有“连接”（因为没有更好的词）到 redux 存储。所以我的问题是：如何从非组件函数访问当前的 redux 存储？谢谢

【问题讨论】：

如果您想在 Redux 中执行此操作，请使用操作。如果您想从 React 组件中执行此操作，请从 componentDidMount 生命周期方法中分派相关操作。
我如何从这个意义上的动作中获取状态？
如果你使用像 redux-thunk 这样的库，你可以从像 myAction(input) { return function(dispatch, getState) { const state = getState(); 这样的动作中获取状态。 }; }
删除文档时总是选择最上面的文档吗？如果是，你为什么不只是在减速器中做呢？这样，您只需调用 deleteShape，顶部文档就会被选中并立即返回。
乔恩，我尝试使用你的函数，但它只返回一个函数，而不是 redux 的商店。你能提供一个更详细的例子来说明如何使用 redux-thunk 吗？我在他们的文档中没有看到任何有关获取商店的信息。

标签： javascript reactjs react-redux

【解决方案1】：

我必须说，我认为从某个函数随机访问商店是一种不好的做法，并且可能会出现一些副作用，但如果必须这样做，这是一种可能的方式：

文件：storeProvider.js

var store = undefined;

export default {
    init(configureStore){
        store = configureStore();
    },
    getStore(){
        return store;
    }
};

文件：App.js

import { createStore } from 'redux';
import rootReducer from './rootReducer';
import storeProvider from './storeProvider';

const configureStore = () => createStore(rootReducer);
storeProvider.init(configureStore);
const store = storeProvider.getStore();

const App = () =>
    <Provider store={store} >
        <Stuff/>
    </Provider>

文件：yourfunction.js

import storeProvider from './storeProvider';

export function deleteDocument (id) {
    this.props.dispatch(deleteShape({id}));

    const state = storeProvider.getStore().getState();

    if(state.documents && !state.documents.find(doc => doc.selected)){
        this.props.dispatch(makeTopDocumentSelected());
    }
}

【讨论】：

如果yourfunction.deleteDocument 在reducer 中被调用，那么你就不走运了。 Redux 会抛出并告诉你传递它。