我打电话给我的终极版中的一个之后进行该调用操作是这样的:终极版,确保终极版完成
performAction(updatesomevalue);
和我想的地方把我的状态时,上面的动作完成:
sendState(state);
如何链接这些调用?行动没有回调,所以我不能使用这种方法,我想这可能不是这样做的一种减少的方式呢?
我打电话给我的终极版中的一个之后进行该调用操作是这样的:终极版,确保终极版完成
performAction(updatesomevalue);
和我想的地方把我的状态时,上面的动作完成:
sendState(state);
如何链接这些调用?行动没有回调,所以我不能使用这种方法,我想这可能不是这样做的一种减少的方式呢?
异步Redux的操作与终极版 - 咚
异步终极版动作打交道时,最简单的解决方案是使用终极版-的thunk。
终极版,thunk的目的是,它使我们能够调度功能的行动(而不是你可能习惯普通的旧对象)
我们为什么要派遣返回的功能操作?
这个问题可以改为:为什么redux thunk一个有用的库?
如果我们可以调度一个函数。然后这个函数可以被授予对redux store API的访问权限,因此当将来调用该操作时,它可以访问该商店的当前状态和分派。有权访问调度是至关重要的,因为这意味着此功能可以派发额外的redux操作。下面是一个redux thunk动作创建器的示例,它遵循返回函数的redux-thunk签名。
这个redux thunk动作创建器调度一个初始异步操作,例如调用一个外部API,然后用该异步API调用的结果更新状态。
然后检索新状态并用于分派额外的动作。 为了使第一个异步api成为可能,我们使用同构获取库,这是一个基于promise的请求库,这就是为什么我们能够通过.then链接获取,然后调用获取返回一个可接受的承诺。
import fetch from 'isomorphic-fetch'
// call api then update state and dispatch second sync action
// based on new state
function thunkActionCreator() {
return (dispatch, getState) => {
return fetch(`http://www.example.com/api/users/${id}`)
.then(response => {
// if request successful dispatch action
// using response data to change state
if (response.status !== 200) {
dispatch(firstAction(response.data))
}
// get the new state
const secondState = getState()
// use this newState to dispatch a new action
dispatch(secondAction(secondState))
})
}
}
记住,你需要终极版,形实转换添加到中间件链
import { createStore, applyMiddleware } from 'redux';
import thunk from 'redux-thunk';
import rootReducer from './reducers/index';
// Note: this API requires [email protected]>=3.1.0
const store = createStore(
rootReducer,
applyMiddleware(thunk)
);
由于终极版,thunk是一个中间件的它坐落在中间件链。在任何redux应用程序中分派动作时,它会通过完整的中间件链,每个中间件都实现一些自定义功能,例如在redux-logger的情况下登录哪个console.logs在应用程序中发生的操作。
一个简单的方法应该是通过redux动作处理代码中的'setTimeout'调用将它添加到JS事件队列中。当我需要副作用时,我已经完成了很多工作,但是如果您在'sendState'中修改状态(在redux流程之外),您可能会遇到不好的时间。 – Josh
如果您的意思是调用'performAction'的代码需要在回调中传递,并且要使用结果,那么我会说恕我直言,您应该尝试将该回调中执行的任何操作转移到事件流/还原状态,以消除该回调的需要。我也这样做过(承诺和行动回调),但在我看来,它更加脆弱和难以推理。 – Josh