Question

我需要从我的redux应用程序的外部调用redux操作，就像在外部js文件中一样。我有一个处理REST请求的api.js文件，而我只需要调用成功响应中的操作并通过我的中间件处理操作。

proplem是我无法访问商店或在api.js文件中发送，即使我导出我的商店因为它没有连接到redux或任何反应组件。

api.js

function ApiRequest(url) {
    return fetch(thisUrl)
        .then(async (rawRes) => {
            if (rawRes && rawRes.status === 200) { 
                // <------- Here i wanna run redux action 
            }

        })
        .catch((err) => {
            console.log(err)
        });

}

apiMiddleware：

const apiMiddleware = store => next => (action) => {
  switch (action.type) {
    case 'API_SUCCESS_RESPONSE' :
      console.log('action success executed')
      break;

    default :
  }
  return next(action);
};

export default apiMiddleware;

任何建议？

Answer 1

基本上，如果您有权访问商店，您可以随时发送行动。

因此，问题的解决方案归结为＆＃34;如何在ApiRequest内提供对store变量的访问？这个问题有很多解决方案。将store分配给Window的全局变量是最简单的。

然而，全局解决方案最终会出现隐式排序问题（商店必须在ApiRequest之前初始化）以及其他问题。

例如，假设您在创建redux商店时分配window.store = store，那么您的代码将如下所示：

function ApiRequest(url) {
    return fetch(thisUrl)
        .then(async (rawRes) => {
            if (rawRes && rawRes.status === 200) { 
                store.dispatch({type: 'API_SUCCESS_RESPONSE' })`
            }

        })
        .catch((err) => {
            console.log(err)
        });

}

修改：要明确，您的问题apiMiddleware 不商店。 ApiMiddleware是一个给出已经创建的商店的函数，它将它包装在中间件中。程序中的某些代码如下所示：

import { createStore } from 'redux'
export apiMiddleware from './apiMiddleware'
const store = createStore(reducers, apiMiddleware)

然后^^^这是您要全局导出的商店。

从redux的ouside调用动作

1 个答案: